資訊專欄INFORMATION COLUMN
摘要：函數(shù)特點(diǎn)可以改變我們當(dāng)前函數(shù)的指向還會讓當(dāng)前函數(shù)執(zhí)行題目自測思路解析執(zhí)行傳入三個(gè)參數(shù)函數(shù)內(nèi)部執(zhí)行傳入三個(gè)參數(shù)函數(shù)內(nèi)部執(zhí)行
call函數(shù)特點(diǎn)：
1)可以改變我們當(dāng)前函數(shù)的this指向
2）還會讓當(dāng)前函數(shù)執(zhí)行
Function.prototype.call = function (context) {
if (typeof this !== "function") {
throw new TypeError(`${this} is not a function`)
}
context = Object(context) || window;
context.fn = this;
let args = [];
for (let i = 1; i < arguments.length; i++) {
args.push("arguments["+i+"]");
}
let r = eval("context.fn("+args+")");
delete context.fn;
return r;
}
function fn1() {
console.log(this,arguments);
console.log(1);
}
function fn2() {
console.log(this,arguments);
console.log(2);
}
fn1.call(fn2,1,2); // fn2 [1,2] 1
fn1.call.call.call.call.call(fn2,1,2); // {number:1} [2] 2
思路解析
fn1.call(fn2,1,2)
1）call執(zhí)行傳入fn2,1,2三個(gè)參數(shù)
2）call函數(shù)內(nèi)部context = Object(fn2) = fn2
3）fn2.fn = fn1
4）args=["arguments[1]","arguments[2]"]=[1,2]
5）eval("context.fn("+args+")") = fn2.fn(1,2) = fn2.fn1(1,2)
fn1.call.call.call.call.call(fn2,1,2)
1）call執(zhí)行傳入fn2,1,2三個(gè)參數(shù)
2）call函數(shù)內(nèi)部context = Object(fn2) = fn2
3）fn2.fn = call
4）args=["arguments[1]",arguments[2]]=[1,2]
5）eval("context.fn("+args+")") = fn2.fn(1,2) = fn2.call(1,2)
6）call執(zhí)行傳入1,2兩個(gè)參數(shù)
7）call函數(shù)內(nèi)部context = Object(1) = Number{1}
8）Number{1}.fn = fn2
9）args=["arguments[1]"]=[1]
10）eval("context.fn("+args+")") = Number{1}.fn(2) = Number{1}.fn2(2)
注：多次調(diào)用call的時(shí)候其實(shí)是call執(zhí)行的時(shí)候內(nèi)部又調(diào)用了一次call，總共調(diào)用兩次
apply函數(shù)特點(diǎn)：
1)可以改變我們當(dāng)前函數(shù)的this指向
2）還會讓當(dāng)前函數(shù)執(zhí)行
Function.prototype.apply = function (context,args) {
if (typeof this !== "function") {
throw new TypeError(`${this} is not a function`)
}
context = Object(context) || window;
context.fn = this;
if(!args){
return context.fn();
}
let r = eval("context.fn("+args+")");
delete context.fn;
return r;
}
new操作符
特點(diǎn)
新生成了對象
鏈接到原型
綁定this
返回一個(gè)對象
/*
*基本使用
*/
function Animal(type) {
this.type = type ;
}
Animal.prototype.say = function () {
console.log("say");
}
let tiger = new Animal("tiger");
console.log(tiger);
--------------------------------------------------------
/*
*方法實(shí)現(xiàn)
*/
function mockNew(){
let Constructor = [].shift.call(arguments);
let obj = {}; // 新生成了對象
obj.__proto__ = Constructor.prototype; // 鏈接到原型
let r = Constructor.apply(obj,arguments) // 綁定`this`
return r instance Object ");//返回一個(gè)對象
}
let tiger = mockNew(Animal,"tiger");
console.log(tiger);
bind函數(shù)
特點(diǎn)
綁定this指向
返回一個(gè)綁定后的函數(shù)(高階函數(shù)原理)
如果綁定的函數(shù)被new執(zhí)行 ，當(dāng)前函數(shù)的this就是當(dāng)前的實(shí)例
new出來的結(jié)果可以找到原有類的原型
Function.prototype.bind = function (context) {
if (typeof this !== "function") {
throw new TypeError(`${this} is not a function`)
}
let that = this;
let bindArgs = Array.prototype.slice.call(arguments, 1);
function Fn() { };
function bindFn() {
let args = Array.prototype.slice.call(arguments);
/*
* 綁定`this`指向
* 如果綁定的函數(shù)被`new`執(zhí)行 ，當(dāng)前函數(shù)的`this`就是當(dāng)前的實(shí)例
*/
that.apply(this instanceof bindFn ");this : context, bindArgs.concat(args));
}
/*`new`出來的結(jié)果可以找到原有類的原型*/
Fn.prototype = that.prototype;
bindFn.prototype = new Fn();
/*返回一個(gè)綁定后的函數(shù)*/
return bindFn;
}
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/6988.html
摘要：可以改變，并且傳入?yún)?shù)，立刻執(zhí)行，返回函數(shù)返回值手寫參數(shù)默認(rèn)值并不會排除，所以重新賦值是調(diào)用的函數(shù)執(zhí)行后刪除新增屬性可以改變，并且傳入?yún)?shù)，與不同的是，傳入的參數(shù)是數(shù)組或類數(shù)組，立刻執(zhí)行，返回函數(shù)返回值手寫參數(shù)默認(rèn)值并不會排除，所以重新賦值 call Function.prototype.call(this, arg1, arg2, …..)可以改變this，并且傳入?yún)?shù)，立刻執(zhí)行，返...
摘要：一是什么函數(shù)的內(nèi)部屬性，引用的是函數(shù)據(jù)以執(zhí)行的環(huán)境對象。函數(shù)做為節(jié)點(diǎn)事件調(diào)用時(shí)指向節(jié)點(diǎn)本身做為構(gòu)造函數(shù)實(shí)力化方法時(shí)指向?qū)嵗龑ο蠹^函數(shù)里的普通函數(shù)，由于閉包函數(shù)是執(zhí)行的，所以指向箭頭函數(shù)的指向函數(shù)創(chuàng)建時(shí)的作用域。 一、this是什么？ 函數(shù)的內(nèi)部屬性，this引用的是函數(shù)據(jù)以執(zhí)行的環(huán)境對象。也就是說函數(shù)的this會指向調(diào)用函數(shù)的執(zhí)行環(huán)境。 function a(){ retur...
摘要：我是前端我的全名是我是一個(gè)前端指向接收多個(gè)參數(shù)，第一個(gè)是返回值返回值是一個(gè)函數(shù)上下文的，不會立即執(zhí)行?？吕锘嚓P(guān)講解請移步簡版的實(shí)現(xiàn)就算完成了歡迎吐槽點(diǎn)贊 它們有什么不同？怎么用？ call 接收多個(gè)參數(shù)，第一個(gè)為函數(shù)上下文也就是this，后邊參數(shù)為函數(shù)本身的參數(shù)。 let obj = { name: 一個(gè) } ...
摘要：如果綁定后的函數(shù)被了，那么此時(shí)指向就發(fā)生改變。構(gòu)造函數(shù)上的屬性和方法，每個(gè)實(shí)例上都有。接下來聲明一個(gè)函數(shù)，在該中獲取了第二次傳的參數(shù)，并且返回了的執(zhí)行。的又等于的實(shí)例。至此，就實(shí)現(xiàn)了自己的方法。 之前已經(jīng)實(shí)現(xiàn)過了call，apply和new。今天順便把bind也實(shí)現(xiàn)下。首先： bind方法返回的是一個(gè)綁定this后的函數(shù)，并且該函數(shù)并沒有執(zhí)行，需要手動去調(diào)用。(從這一點(diǎn)看bind函數(shù)...
摘要：最近準(zhǔn)備初級前端面試，發(fā)現(xiàn)有很多手寫實(shí)現(xiàn)什么的，例如什么手寫實(shí)現(xiàn)，。后面以這道題為引線面試官可能會追問什么是執(zhí)行上下文的判斷，的區(qū)別手寫一個(gè)函數(shù)實(shí)現(xiàn)斐波那契數(shù)列首先拷一個(gè)阮神在他教程里的一個(gè)寫法。 最近準(zhǔn)備初級前端面試，發(fā)現(xiàn)有很多手寫實(shí)現(xiàn)什么的，例如什么手寫實(shí)現(xiàn)bind，promise。手寫ajax，手寫一些算法。翻閱了很多書籍和博客。 這里做一個(gè)總結(jié)改進(jìn)，算是對我后面大概為期一個(gè)月找...
閱讀 3299·2021-10-11 11:08
閱讀 4439·2021-09-22 15:54
閱讀 922·2019-08-30 15:56
閱讀 876·2019-08-30 15:55
閱讀 3549·2019-08-30 15:52
閱讀 1360·2019-08-30 15:43
閱讀 1943·2019-08-30 11:14
閱讀 2513·2019-08-29 16:11
