标签:delete bsp foo pre 添加 style 第一步 val app
1、先来看call的一个例子
1 var value = 1; 2 var foo = { 3 value: 1 4 }; 5 6 function bar() { 7 console.log(this.value); 8 } 9 10 bar.call(foo); // 1
猜想:假设在执行call的时候,把bar函数添加到foo对象下,执行foo.bar,具体如下:
1 var foo = { 2 value: 1, 3 bar: function() { 4 console.log(this.value); 5 } 6 }; 7 8 foo.bar(); // 1
这就是我们模拟实现的第一步;
2、实现call函数,就得了解call函数执行的过程,如下:
①:this 参数可以传 null
或者 undefined
,此时 this 指向 window
②:this 参数可以传基本类型数据,原生的 call 会自动用 Object() 转换
③:函数是可以有返回值的
1 Function.prototype.call2 = function (context) { 2 context = context ? Object(context) : window; // 实现 ① 和 ② 3 context.fn = this; 4 5 var args = []; 6 for(var i = 1, len = arguments.length; i < len; i++) { 7 args.push(‘arguments[‘ + i + ‘]‘); 8 } 9 10 var result = eval(‘context.fn(‘ + args +‘)‘); 11 12 return result; // 实现细节 ③ 13 }
3、收尾:context多了一个fn属性,在结尾用delete将其删除
1 Function.prototype.call2 = function (context) { 2 context = context ? Object(context) : window; 3 context.fn = this; 4 5 var args = []; 6 for(var i = 1, len = arguments.length; i < len; i++) { 7 args.push(‘arguments[‘ + i + ‘]‘); 8 } 9 10 var result = eval(‘context.fn(‘ + args +‘)‘); 11 12 delete context.fn//删除多余属性fn 13 return result; 14 }
4、apply的实现
apply和call函数的区别在于参数的形式;具体实现如下:
1 Function.prototype.apply = function (context, arr) { 2 context = context ? Object(context) : window; 3 context.fn = this; 4 5 var result; 6 // 判断是否存在第二个参数 7 if (!arr) { 8 result = context.fn(); 9 } else { 10 var args = []; 11 for (var i = 0, len = arr.length; i < len; i++) { 12 args.push(‘arr[‘ + i + ‘]‘); 13 } 14 result = eval(‘context.fn(‘ + args + ‘)‘); 15 } 16 17 delete context.fn 18 return result; 19 }
标签:delete bsp foo pre 添加 style 第一步 val app
原文地址:https://www.cnblogs.com/yecy1992/p/12613292.html