【js基礎(chǔ)】之this,call,apply,bind

khs1994 發(fā)布于2019-08-22 16:47 / 1713人閱讀

摘要：的使用場(chǎng)景作為構(gòu)造函數(shù)執(zhí)行作為對(duì)象屬性執(zhí)行作為普通函數(shù)執(zhí)行。要在執(zhí)行時(shí)才能確認(rèn)值，定義時(shí)無法確認(rèn)改變上下文指向。

1.this

this的使用場(chǎng)景：

1.作為構(gòu)造函數(shù)執(zhí)行；

2.作為對(duì)象屬性執(zhí)行；

3.作為普通函數(shù)執(zhí)行；

4.call apply bind。

this要在執(zhí)行時(shí)才能確認(rèn)值，定義時(shí)無法確認(rèn)

var a = {
    name:"A",
    fn:function(){
        console.log(this.name);
    }
}

a.fn();//this===a

a.fn.call({name:"B"});//this==={name:"B"}

var fn1 = a.fn;
fn1();//this===window

2.call,apply

改變上下文this指向。

fn.call({this指向},參數(shù)1,參數(shù)2)

fn.apply({this指向},[參數(shù)1,參數(shù)2])

//call
function fn2(name,age){
    alert(name);//zhangsan
    console.log(this);//{x: 100}
}

fn2.call({x:100},"zhangsan",20);

//apply
function fn3(name,age){
    alert(name);//lisi
    console.log(this);//{y: 200}
}

fn3.apply({y:200},["lisi",30]);

3.bind

在函數(shù)表達(dá)式后邊改變函數(shù)的上下文。

var fn = function(參數(shù)){}.bind({this指向});

fn(參數(shù))

var fn4 = function(name,age){
    alert(name);//wangwu
    console.log(this);//{z: 300}
}.bind({z:300});

fn4("wangwu",40);

GPU云服務(wù)器云服務(wù)器 JS中bind、call和apply的作 js中的call和apply apply與call的區(qū)別之基礎(chǔ)篇

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://specialneedsforspecialkids.com/yun/94657.html

相關(guān)文章

JS系列之call & apply & bind

摘要：參考鏈接在中，和是對(duì)象自帶的三個(gè)方法，都是為了改變函數(shù)體內(nèi)部的指向。返回值是函數(shù)方法不會(huì)立即執(zhí)行，而是返回一個(gè)改變了上下文后的函數(shù)。而原函數(shù)中的并沒有被改變，依舊指向全局對(duì)象。原因是，在中，多次是無效的。參考鏈接：https://juejin.im/post/59bfe8... 在JavaScript中，call、apply和bind是Function對(duì)象自帶的三個(gè)方法，都是為了改變...

xiaochao 2019-08-23 13:09 評(píng)論0 收藏0
面試官問：JS的this指向

摘要：之前寫過一篇文章面試官問能否模擬實(shí)現(xiàn)的和方法就是利用對(duì)象上的函數(shù)指向這個(gè)對(duì)象，來模擬實(shí)現(xiàn)和的。雖然實(shí)際使用時(shí)不會(huì)顯示返回，但面試官會(huì)問到。非嚴(yán)格模式下，和，指向全局對(duì)象前言面試官出很多考題，基本都會(huì)變著方式來考察this指向，看候選人對(duì)JS基礎(chǔ)知識(shí)是否扎實(shí)。讀者可以先拉到底部看總結(jié)，再谷歌（或各技術(shù)平臺(tái)）搜索幾篇類似文章，看筆者寫的文章和別人有什么不同（歡迎在評(píng)論區(qū)評(píng)論不同之處），...

warnerwu 2019-08-23 14:17 評(píng)論0 收藏0
javascript 基礎(chǔ)之 call, apply, bind

摘要：系統(tǒng)，扎實(shí)的語言基礎(chǔ)是一個(gè)優(yōu)秀的前端工程師必須具備的。第一個(gè)參數(shù)為調(diào)用函數(shù)時(shí)的指向，隨后的參數(shù)則作為函數(shù)的參數(shù)并調(diào)用，也就是。和的區(qū)別只有一個(gè)，就是它只有兩個(gè)參數(shù)，而且第二個(gè)參數(shù)為調(diào)用函數(shù)時(shí)的參數(shù)構(gòu)成的數(shù)組。系統(tǒng)，扎實(shí)的 javascript 語言基礎(chǔ)是一個(gè)優(yōu)秀的前端工程師必須具備的。在看了一些關(guān)于 call，apply，bind 的文章后，我還是打算寫下這篇總結(jié)，原因其實(shí)有好幾個(gè)。...

xeblog 2019-08-23 18:23 評(píng)論0 收藏0
javascript基礎(chǔ)之this

摘要：出現(xiàn)箭頭函數(shù)的時(shí)候，指向?yàn)槎x時(shí)的上下文對(duì)象而非指向時(shí)，并且不能被改變首先我們先看一個(gè)例子由上面的例子我們可以看出來此時(shí)指針在用改變了之后指向的依然是全局對(duì)象非嚴(yán)格瀏覽器環(huán)境中是而非。 javascript基礎(chǔ)之this指針越往后面學(xué)越發(fā)現(xiàn)基礎(chǔ)的重要性，所以打算重新過一遍基礎(chǔ)，之后出幾個(gè)vue和react的實(shí)戰(zhàn)教程。ok，嚴(yán)歸正傳。首先什么是this this是執(zhí)行上下文創(chuàng)建時(shí)確定...

Zoom 2019-08-22 13:57 評(píng)論0 收藏0
前端面經(jīng)整理之JS和CSS

摘要：作為對(duì)象原型鏈的終點(diǎn)。調(diào)用函數(shù)時(shí)，應(yīng)該提供的參數(shù)沒有提供，該參數(shù)等于。它可以用于引用該函數(shù)的函數(shù)體內(nèi)當(dāng)前正在執(zhí)行的函數(shù)。一 JS 二 CSS 一 JS ==和===的區(qū)別 ===叫做嚴(yán)格運(yùn)算符 ==叫做相等運(yùn)算符嚴(yán)格運(yùn)算符比較時(shí)不僅僅比較數(shù)值還要比較數(shù)據(jù)類型是否一樣相等運(yùn)算符在比較相同類型的數(shù)據(jù)時(shí)，與嚴(yán)格相等運(yùn)算符完全一樣。在比較不同類型的數(shù)據(jù)時(shí)，相等運(yùn)算符會(huì)先將數(shù)據(jù)進(jìn)行類型轉(zhuǎn)換，...

stonezhu 2019-08-21 17:34 評(píng)論0 收藏0