做动漫网站的小说,企业管理培训课程报名,网站建设公司-山而,聊城网站制作信息目录 1.函数的call、apply、bind方法
1.1call、apply、bind的相同点
1.2call、apply、bind的不同点
1.3call、apply、bind的使用场景
2. 对象的深拷贝
2.1对象的浅拷贝
2.1对象的深拷贝 1.函数的call、apply、bind方法
1.1call、apply、bind的相同点
在没有传参数时三者的this指向都是window。有参数时第一个参数必须传而且必须是对象类型此时this指向已经改变为传过来的对象 function show(a, b) {console.log(a, b);console.log(this);}show();//this是windowshow.call();//this是windowshow.apply();//this是windowvar fn show.bind(); //有返回值返回和原函数长得一样的新函数。可以show.bind()()调用 也可以fn()fn()//this是window
1.2call、apply、bind的不同点
调用方法函数名.call();和 函数名.apply();调用方法一样都是在后方加一个括号即可。而bind需要跟两个括号eg:函数名.bind()()传参数的的形式不同 函数名.call(对象,实参1,实参2); 函数名.apply(对象,[实参1,实参2]); 函数名.bind(对象,实参1,实参2)(); apply的第二个参数是以数组的形式来传递的。
1.3call、apply、bind的使用场景
call借助构造函数实现继承 scriptfunction Fatner(x, y) {this.x x;this.y y;}Fatner.prototype.say function () {console.log(aaa);}function Son(x, y, z) {Fatner.call(this, x, y);console.log(this); //如果不回指则this指向Fatherthis.z z;}Son.prototype.bbb function () {console.log(bbb);}Son.prototypre Object.create(Fatner.prototype); //将父的方法复制过来。Son.prototype.constructon Son //进行回指操作表示Son的构造器为Son。Son(1, 2, 3);/script apply 求数组的最大值或最小值 var max Math.max.apply(Math, [10, 20, 30, 40, 23]);console.log(max); bind: 在不调用函数的情况下改变this的指向。 button确定/buttonscriptvar btn document.querySelector(button);btn.addEventListener(click, function () {this.disabled true;setTimeout(function () {this.disabled false;}.bind(this), 1000)})/script
2. 对象的深拷贝 深浅拷贝最大的区别就是对一个对象进行修改另一个会不会也被修改如果两个对象同时进行了修改那就是进行了浅拷贝的操作如果另一个没有发生改变那就是进行了深拷贝的操作。数组和对象都有深浅拷贝的概念。
2.1对象的浅拷贝
可以利用 Object.assign()进行对象的浅拷贝操作。 scriptobj {name: zhangzhang,age: 20,arr: [12, 34, 765, [11, 55], {a: aaa,b: bbb}]}var obj1 Object.assign(obj);obj.name lili;obj1.arr[3][0] 88;console.log(obj1, obj);/script
2.1对象的深拷贝
对象的深拷贝有三种方式 1使用JSON.stringify() 和JSON.parse()将对象先转成JSON格式再转回来就完成了深拷贝的操作。
var obj1 JSON.parse(JSON.stringify(obj) ) (2)Lodash 官网直接引用一个js文件过来然后用里面的var obj1 _.cloneDeep(obj); script srchttps://cdn.bootcdn.net/ajax/libs/lodash.js/4.17.21/lodash.js/script scriptobj {name: zhangzhang,age: 20,arr: [12, 34, 765, [11, 55], {a: aaa,b: bbb}]}var obj2 _.cloneDeep(obj);obj.name lili;obj2.arr[3][0] 88;console.log(obj2, obj);/script (3用递归来完成原生方法 scriptobj {name: zhangzhang,age: 20,arr: [12, 34, 765, [11, 55], {a: aaa,b: bbb}]}function copy(obj) {if (typeof obj ! object) {return obj;}var newobj obj instanceof Array ? [] : {};for (var k in obj) {newobj[k] copy(obj[k])}return newobj;}var obj3 copy(obj);obj.name lili;obj3.arr[3][0] 88;console.log(obj3, obj);/script