成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

call/apply/bind 的理解與實(shí)例分享

PingCAP / 3176人閱讀

摘要：可以改變函數(shù)的指向。除了傳遞參數(shù)時(shí)有所差別，和作用完全一樣。因此最終的返回結(jié)果會(huì)是。其中傳遞的參數(shù)為數(shù)組形式傳遞的參數(shù)為按順序依次排列。一個(gè)簡(jiǎn)單的實(shí)例說(shuō)明。

call/apply 可以改變函數(shù)的this指向。 除了傳遞參數(shù)時(shí)有所差別，call和apply作用完全一樣。

var tim = { 
    name: "tim", 
    age: 20, 
    getName: function() {
        console.log(this.name);
        return this.name; 
    }
}

var jake = { name: "jake", age: 20 }

tim.getName(); // tim

// jake對(duì)象沒有g(shù)etName方法，但是可以通過(guò)call/apply去使用tim對(duì)象的getName方法
tim.getName.call(jake);  // jake 
tim.getName.apply(jake); // jake

tim.getName.call(jake)的意思是執(zhí)行getName方法，但是通過(guò)call/apply將getName方法中的this指向強(qiáng)行設(shè)置為jake對(duì)象。因此最終的返回結(jié)果會(huì)是jake。

call apply的不同之處在于傳遞參數(shù)的形式。其中apply傳遞的參數(shù)為數(shù)組形式, call傳遞的參數(shù)為按順序依次排列。一個(gè)簡(jiǎn)單的實(shí)例說(shuō)明。

// 當(dāng)參數(shù)個(gè)數(shù)不確定或者你覺得用apply比較爽時(shí), 就直接使用apply
// 字面解釋就是obj奪舍fn，obj擁有了執(zhí)行fn函數(shù)的能力，并且this指向obj.
var arguments = { 0:"name", 1:"age", 2:"gender" };

fn.apply(obj, arguments);
fn.call(obj, name, age, gender);

下面我收集了幾個(gè)我遇到過(guò)的實(shí)際例子

將類數(shù)組形式轉(zhuǎn)換為數(shù)組

// arguments
// 返回值為數(shù)組，arguments保持不變
var arg = [].slice.call(arguments);

// nodeList
var nList = [].slice.call(document.getElementsByTagName("li"));

方法借用

var foo = {
    name: "joker",
    showName: function() {
        console.log(this.name);
    }
};
var bar = {
    name: "rose"
};

foo.showName.call(bar); // rose

在繼承中的應(yīng)用

// parent
var Person = function(name) {
    this.name = name;
    this.gender = ["man", "woman"];
}

// child
var Student = function(name, age) {

    // inherit
    Person.call(this);
}
Student.prototype.message = function() {
    console.log("name:"+this.name+", age:"+this.age+", gender:."+this.gender[0]);
}

var xm = new Student("xiaom", 12);
xm.message(); //name:undefined, age:undefined, gender:.man

封裝對(duì)象時(shí)保證this指向

var Nicco = function(name) {
    this.name = name;
}
Nicco.prototype = function() {
    constructor: Nicco,

    message: function() {
        var _this = this;
        addEventListener(
            "mousedown",
            function() {
                // stay this
                return _this.fndown.call(_this);
            },
            false
        );
    },

    fndown: function() {
        var
            _this = this,
            str = this.name + ", i miss you.";
        addEventListener(
            "mouseup",
            function() {
                return _this.fnup.call(_this, str);
            },
            false
        );
    },

    fnup: function(str) {
        console.log(str);
    }
}

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

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

相關(guān)文章

  • 《javascript高級(jí)程序設(shè)計(jì)》函數(shù)調(diào)用模式 & this深度理解

    在上一篇文章（《javascript高級(jí)程序設(shè)計(jì)》筆記：Function類型）中稍微提及了一下函數(shù)對(duì)象的屬性—this，在這篇文章中有深入的說(shuō)明： 函數(shù)的三種簡(jiǎn)單調(diào)用模式 1 函數(shù)模式 定義的函數(shù)，如果單獨(dú)調(diào)用，不將其與任何對(duì)象關(guān)聯(lián)，那么就是函數(shù)調(diào)用模式 function fn(num1, num2) { console.log(this); } // 直接在全局調(diào)用 fn();// w...

    wyk1184 評(píng)論0 收藏0

  • ES5 call,apply,bind方法總結(jié)（包括理解this的指向問(wèn)題）

    總結(jié)call,apply,bind方法的理解使用和區(qū)別。 call,apply,bind這三個(gè)方法在JavaScript中是用來(lái)改變函數(shù)調(diào)用的this指向。那么改變函數(shù)this指向有什么用呢？我們先來(lái)看一段代碼 var a= { name:harden, fn:function () { console.log(this.name); } } var b =...

    nanchen2251 評(píng)論0 收藏0

  • 理解 JavaScript call()/apply()/bind()

    摘要：理解文章中已經(jīng)比較全面的分析了在中的指向問(wèn)題，用一句話來(lái)總結(jié)就是的指向一定是在執(zhí)行時(shí)決定的，指向被調(diào)用函數(shù)的對(duì)象。與和直接執(zhí)行原函數(shù)不同的是，返回的是一個(gè)新函數(shù)。這個(gè)新函數(shù)包裹了原函數(shù)，并且綁定了的指向?yàn)閭魅氲摹? 理解 JavaScript this 文章中已經(jīng)比較全面的分析了 this 在 JavaScript 中的指向問(wèn)題，用一句話來(lái)總結(jié)就是：this 的指向一定是在執(zhí)行時(shí)決定的，...

    duan199226 評(píng)論0 收藏0

  • js 面試官想了解你有多理解call,apply,bind?

    摘要：返回值這段在下方應(yīng)用中有詳細(xì)的示例解析。回調(diào)函數(shù)丟失的解決方案綁定回調(diào)函數(shù)的指向這是典型的應(yīng)用場(chǎng)景綁定指向，用做回調(diào)函數(shù)。 showImg(https://segmentfault.com/img/remote/1460000019971331?w=1024&h=680); 函數(shù)原型鏈中的 apply，call 和 bind 方法是 JavaScript 中相當(dāng)重要的概念，與 this...

    wuaiqiu 評(píng)論0 收藏0

  • 理解 JavaScript this

    摘要：回調(diào)函數(shù)在回調(diào)函數(shù)中的指向也會(huì)發(fā)生變化。在閉包回調(diào)函數(shù)賦值等場(chǎng)景下我們都可以利用來(lái)改變的指向，以達(dá)到我們的預(yù)期。文章參考系列文章理解閉包理解執(zhí)行棧理解作用域理解數(shù)據(jù)類型與變量原文發(fā)布在我的公眾號(hào)，點(diǎn)擊查看。 這是本系列的第 5 篇文章。 還記得上一篇文章中的閉包嗎？點(diǎn)擊查看文章 理解 JavaScript 閉包 。 在聊 this 之前，先來(lái)復(fù)習(xí)一下閉包： var name = Nei...

    zombieda 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

閱讀需要支付1元查看
<