Javascript
Software攻城狮
从 "前端" 向 "大前端" 方向进发 ————
(成功人士习惯去做失败者不爱做的事。他们当然也不喜欢干这些事,但他们让这种不喜欢服从于对自己目标的追求 。。。。。。 远离舒适,不断学习,知识更新,提升竞争力)
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
js如何要让一个对象继承另一个对象的原型属性和方法
Object.setPrototypeOf() 方法也是用来设置一个对象的原型,它是ES6规范的一部分,比直接操作。6、使用 Object.setPrototypeOf()js如何要让一个对象继承另一个对象的原型属性和方法。1、使用 Object.create()3、使用构造函数和原型链。.4、使用ES6的类。原创 2024-07-08 14:12:57 · 311 阅读 · 0 评论 -
async await 的底层原理
async的底层原理原创 2023-06-05 09:34:54 · 223 阅读 · 0 评论 -
js方法调用 引入中间变量,导致this指向丢失
【代码】js方法调用 引入中间变量,导致this指向丢失。原创 2023-05-17 10:45:54 · 152 阅读 · 0 评论 -
input 搜索如何防抖,如何处理中文输入
input 搜索如何防抖,如何处理中文输入原创 2022-12-29 09:46:42 · 445 阅读 · 0 评论 -
Promise的使用示例
promise的使用示例原创 2022-12-22 14:47:42 · 115 阅读 · 0 评论 -
如何解决移动端 Retina 屏(高清屏)1px 像素问题
如何解决移动端 Retina 屏(高清屏)1px 像素问题原创 2022-11-20 22:56:25 · 339 阅读 · 0 评论 -
图片压缩的组件实现
图片压缩原创 2022-05-30 08:58:58 · 130 阅读 · 0 评论 -
window.location.href和window.open的使用
window.location.href和window.open的使用self.location.href="/url" 当前页面打开URL页面location.href="/url" 当前页面打开URL页面windows.location.href="/url" 当前页面打开URL页面,前面三个用法相同。this.location.href="/url" 当前页面打开URL页面parent.location.href="/url" 在父页面打开新页面top.location.href="/ur原创 2022-01-11 21:00:00 · 1483 阅读 · 0 评论 -
解构赋值(ES6)
解构赋值(ES6)解构赋值语法是一种 Javascript 表达式。通过解构赋值, 可以将属性/值从对象/数组中取出,赋值给其他变量。let a, b, rest;[a, b] = [10, 20];console.log(a);// expected output: 10console.log(b);// expected output: 20//分配剩余值[a, b, ...rest] = [10, 20, 30, 40, 50];console.log(rest);//原创 2021-12-17 19:45:00 · 1443 阅读 · 1 评论 -
js数组对象及对象的互相转换
js数组对象及对象的互相转换数组对象转对象法 一:const array = [{ book: 5, car: 6, pc: 7 }, { headphone: 9, keyboard: 10 }],object = Object.assign({}, ...array);法二 let arrObj = [ { 0: 'a', 1: 'b', 2: 'c', }, ] cons原创 2021-11-10 16:40:24 · 458 阅读 · 0 评论 -
async await 和promise的理解
async await原创 2021-10-18 22:15:17 · 136 阅读 · 0 评论 -
promise.all的使用
promise.all的使用在某些页面需同时调用多个后端接口,会存在异步问题,这时需要通过promise.all来处理,当然需要保证接口返回没有报错,即使接口异常,也不用返回报错,可提升系统异常等原创 2021-07-29 08:44:02 · 137 阅读 · 0 评论 -
js中如何获取对象数组的值
js中如何获取对象数组的值效果图:实现:原创 2021-04-30 07:00:58 · 3062 阅读 · 0 评论 -
定时器的简单应用动画,滑块的移动
定时器的简单应用动画,滑块的移动<body> <style> * { margin: 0; padding: 0; } #box1 { width: 100px; height: 100px; background-color: red; position: absolute;原创 2021-03-18 21:39:56 · 182 阅读 · 0 评论 -
通过js获取元素的样式
通过js获取元素的样式 /* 参数: obj 要获取样式的元素 name 要获取的样式名 */ function getStyle(obj,name){ /* if (window.getComputedStyle){ return getComputedStyle(obj,null)[name]; }else{ //I原创 2021-03-17 08:05:17 · 152 阅读 · 0 评论 -
如何区分不同类型的浏览器(使用navigator对象)
如何区分不同类型的浏览器(使用navigator对象) var ua = navigator.userAgent if(/firefox/i.test(ua)){ alert("我是火狐") }else if(/chrome/i.test(ua)){ alert("我是chrome") }else if(/chrome/i.test(ua)){ alert("原创 2021-03-09 21:52:43 · 270 阅读 · 0 评论 -
js事件的绑定及bind函数
js事件的绑定bind函数方式一对象 . 事件 = 函数 的形式绑定响应函数只能同时为一个元素的同一个事件绑定一个响应函数 btn1.onclick = function(){ alert(1);}方式二addEventListener() ,不支持IE8及以下浏览器,用attachEvent代替 btn1.addEventListener("click" , function(){ alert(1); },false )兼容方案原创 2021-03-02 23:19:30 · 498 阅读 · 0 评论 -
自定义事件的触发 dispatchEvent
拖拽功能的实现(表格拉伸等)1.伸缩事件的监听 的触发,dispatchEvent export class DetailService { resize(){ setTimeout(() =>{ const resizeEvent : Event = document.createElement('Event'); resizeEvent.initEvent('resize',false原创 2021-02-24 21:42:39 · 246 阅读 · 0 评论 -
js应用实例
js应用实例幻灯片弹窗。。。参考:https://www.runoob.com/js/js-examples.html原创 2021-02-24 21:26:50 · 150 阅读 · 0 评论 -
js实现拖拽
js实现拖拽<html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><style> *{ margin: 0;原创 2021-02-19 10:23:48 · 283 阅读 · 0 评论 -
ES6中的扩展运算符拷贝问题以及常用的深浅拷贝方法
ES6中数组和对象的扩展运算符拷贝问题以及常用的深浅拷贝方法在ES6中新增了扩展运算符可以对数组和对象进行操作。有时候会遇到数组和对象的拷贝,可能会用到扩展运算符。那么这个扩展运算符到底是深拷贝还是浅拷贝呢?一.、使用扩展运算符拷贝首先是下面的代码。let a = [1,2,3];let b = [...a];a == b // false结果是false,这是很容易知道的,毕竟这个赋值操作符是有区别的。接下来将数组的值进行改变,又会怎样呢;let a = [1,2,3];let b =转载 2021-02-23 12:15:57 · 2459 阅读 · 0 评论 -
js复制功能的实现
js复制功能的实现 //复制功能 export function duplicate(data){ let textarea = document.createElement("textarea"); textarea.value = data ; document.body.appendChild(textarea); textarea.select(); let replicate =原创 2021-02-18 16:23:13 · 119 阅读 · 0 评论 -
js正则匹配的应用示例(去除输入框的前后空格及邮箱,手机号等)
js正则匹配去除输入框的前后空格// * 表示: 零个 或多个字符 也可以用 + , 一个或多个去除开头空格:str =str.replace(/^\s*/ , "");去除结尾空格:str = str.replace(/\s*$/ , "")去除前后空格:str = str.replace(/^\s*|\s*$/g , "")...原创 2021-01-31 22:47:20 · 623 阅读 · 0 评论 -
生成x-y之间的随机数
生成x-y之间的随机数 for (i = 1; i < 100; i++) { console.log(Math.round(Math.random()*(y-x) + x )) }原创 2021-01-24 16:00:46 · 857 阅读 · 1 评论 -
通过时间戳来测试代码的性能
通过时间戳来测试代码的性能//时间戳 : 当前代码执行时间距离格林威治时间的距离(1/1/1970 0:0:0) var start = Date.now() for (i = 1; i < 100; i++) { console.log(i) } var end = Date.now() console.log(end, "执行了" + (end - start) + "毫秒") // 161147265原创 2021-01-24 15:32:44 · 373 阅读 · 0 评论 -
async awit 异步调用的理解及应用
async awit 异步调用的理解及应用async 是“异步”的简写,而 await 可以认为是 async wait 的简写。所以应该很好理解 async 用于申明一个 function 是异步的,而 await 用于等待一个异步方法执行完成。1.1. async 起什么作用async 函数,输出的是一个 Promise 对象。(从文档中也可以得到这个信息),async 函数(包含函数语句、函数表达式、Lambda表达式)会返回一个 Promise 对象,如果在函数中 return 一个直接量,a原创 2021-01-01 22:24:53 · 316 阅读 · 1 评论 -
对象工厂函数和构造函数的区别
对象工厂函数和构造函数的区别使用工厂函数创建对象我们可以编写一个函数,此函数的功能就是创建对象,可以将其称为“对象工厂方法”。定义对象“构造”函数注意点:对象构造函数首字母大写;内部使用this关键字给对象添加成员;使用new关键字调用对象构造函数★ 对象的constructor属性使用对象构造函数创建对象,每个对象的constructor属性都会引用这个构造函数;如下图示,使用对象工厂函数创建对象,每个对象的constructor属性引用Object();如下图示,对象构造函数与对转载 2020-08-02 22:59:26 · 1042 阅读 · 0 评论 -
js中构造函数的理解
js中构造函数的理解JavaScript 中的构造函数和其它语言中的构造函数是不同的。 通过 new 关键字方式调用的函数都被认为是构造函数。如果被调用的函数没有显式的 return 表达式,则隐式的会返回 this 对象 - 也就是新创建的对象。function Foo() { this.bla = 1;}Foo.prototype.test = function() { console.log(this.bla);};var test = new Foo();上面代原创 2020-08-02 22:50:44 · 363 阅读 · 0 评论 -
js中的hasOwnProperty 函数
js中的hasOwnProperty 函数为了判断一个对象是否包含自定义属性而不是原型链上的属性, 我们需要使用继承自 Object.prototype 的 hasOwnProperty 方法。备注:和 in 操作符一样,for in 循环同样在查找对象属性时遍历原型链上的所有属性。// 修改 Object.prototypeObject.prototype.bar = 1;var foo = {moo: 2};for(var i in foo) { console.log(i);原创 2020-08-02 16:09:25 · 273 阅读 · 0 评论 -
ES6之let 和 var 之比较
ES6之let 和 var 之比较例1:代码如下所示: { var a=5; let b=10; } console.log(a); console.log(b);例2: var a=[]; for(var i=0;i<10;i++){ ...转载 2020-04-15 23:49:39 · 193 阅读 · 0 评论 -
js识别设备来源
js识别设备来源<script> isPC() // 判断pc端还是移动端 function isPC() { // debugger var userAgentInfo = navigator.userAgent; var Agents = ["Android", "iPhone", "Symbia...原创 2020-02-23 11:40:59 · 293 阅读 · 0 评论 -
JS中数组的常用方法
map()原数组的每一项执行函数后,返回一个新的数组。原数组不变。(注意该方法和forEach的区别)some()该方法用于检测数组中的元素是否满足指定条件(函数提供)。some() 方法会依次执行数组的每个元素:如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。如果没有满足条件的元素,则返回false。不会改变原始数组。filter() 过滤...原创 2019-10-04 10:13:30 · 142 阅读 · 0 评论 -
JS中字符串常用方法
##JS中字符串常用方法1、toLowerCase(): 把字符串转为小写,返回新的字符串。var str=“Hello World”;var str1=str.toLowerCase();console.log(str1); //hello world2、toUpperCase(): 把字符串转为大写,返回新的字符串。var str=“hello world”;var str1=s...原创 2019-08-27 22:00:10 · 1042 阅读 · 0 评论
分享