this和call,apply,bind

Ali_ 發布于2019-08-23 12:42 / 2401人閱讀

摘要：中的代表的是當前行為的主體中的代表的是當前行為的執行環境區域是誰和函數在哪里寶的和在哪執行的都沒有任何關系函數執行，首先看函數名前面是否有有的話，前面是誰就是誰沒有的話就是自執行函數中的永遠是給元素的某一個事件綁定方法，當事件觸

this

js中的this代表的是當前行為的主體

js中的context代表的是當前行為的執行環境區域

this是誰和函數在哪里寶的和在哪執行的都沒有任何關系

函數執行，首先看函數名前面是否有"." ,有的話，"."前面是誰this就是誰,沒有的話this就是window

        function fn() {
            console.log(this)
        }
        var obj = {
            fn: fn
        }
        fn(); //this->window
        obj.fn(); //this->obj

        function sum() {
            console.log(this)//this->window
            fn(); //this->window
        }
        sum();

        var oo = {
            sum: function() {
                console.log(this)//this->00
                fn(); //this->window
            },
            aa:"aa"
        }
        oo.sum();

自執行函數中的this永遠是window

        function fn() {
            console.log(this)//window
        }
        fn()

給元素的某一個事件綁定方法，當事件觸發的時候，執行對應的方法，方法中的this是當前的元素 直接調用

        function fn() {
            console.log(this)
        }
        document.getElementById("div1").onclick = fn; //this->#div

匿名函數調用

        function fn() {
            console.log(this)
        }
        document.getElementById("div1").onclick = function(){
            console.log(this)            // this->#div
            fn()//this->window
        }

call

非嚴格模式

        var obj = { name: "jie" };
        function fn(num1, num2) {
            console.log(this);
            console.log(num1 + num2);
        }
        fn(100,200);   //this ->window  num1=100,num2=200
        fn.call(100,200)   //this->100  num1 = 200,num2=undefined
        fn.call(obj,100,200);  //this->obj  num1 = 100,num2=200

        fn.call();  //this->window
        fn.call(null); //this->window
        fn.call(undefined); //this->window

嚴格模式

        "use strict";
        var obj = {name:"jie"};
        function fn(num1,num2){
            console.log(this);
            console.log(num1+num2);
        }
        fn(100,200);   //this ->window  num1=100,num2=200
        fn.call(100,200)   //this->100  num1 = 200,num2=undefined
        fn.call(obj,100,200);  //this->obj  num1 = 100,num2=200

        fn.call();   //undefined
        fn.call(null);  //null
        fn.call(undefined);  //undefined

apply

apply和call的方法的作用是一模一樣的，

call在給fn傳遞參數的時候，是一個個的傳遞值的，而apply不是一個一個傳，而是把要給fn傳遞的參數值統一放在一個數組中進行操作，但是也相當于一個個的給fn的形參賦值

        var obj = { name: "jie" };
        function fn(num1, num2) {
            console.log(this);
            console.log(num1 + num2);
        }
        fn(100,200);   //this ->window  num1=100,num2=200
        fn.apply([100,200])   //this->[100,200]  num1 = NaN,num2=NaN
        fn.apply(obj,[100,200]);  //this->obj  num1 = 100,num2=200

        fn.apply();  //this->window
        fn.apply(null); //this->window
        fn.apply(undefined); //this->window

bind

預處理:事先把fn的this改變為我們想要的結果，并且把對應的參數值也準備好，以后要用到了，直接的執行即可

var result = fn.bind(obj,1,2) 只是改變了fn中的this為obj,并且給fn傳遞了兩個參數值100,200,但是此時并沒有把fn這個函數執行，執行bind會有一個返回值,這個返回值result就是我們把fn的this改變后的哪個結果

        var obj = { name: "jie" };
        function fn(num1, num2) {
            console.log(this);
            console.log(num1 + num2);
        }
        var result = fn.bind(obj, 100, 200);  //this->obj  num1 = 100,num2=200
        console.log(result)

云服務器 GPU云服務器 JS中bind、call和apply的作 js中的call和apply apply與call的區別 apply()

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/98951.html

JS基礎篇--call、apply、bind方法詳解

摘要：首先我們可以通過給目標函數指定作用域來簡單實現方法保存，即調用方法的目標函數考慮到函數柯里化的情況，我們可以構建一個更加健壯的這次的方法可以綁定對象，也支持在綁定的時候傳參。原因是，在中，多次是無效的。而則會立即執行函數。 bind 是返回對應函數，便于稍后調用；apply 、call 則是立即調用。 apply、call 在 javascript 中，call 和 apply 都是...

lastSeries 2019-08-21 12:10 評論0 收藏0
JS中的call、apply、bind方法詳解

摘要：不能應用下的等方法。首先我們可以通過給目標函數指定作用域來簡單實現方法保存，即調用方法的目標函數考慮到函數柯里化的情況，我們可以構建一個更加健壯的這次的方法可以綁定對象，也支持在綁定的時候傳參。原因是，在中，多次是無效的。 bind 是返回對應函數，便于稍后調用；apply 、call 則是立即調用。 apply、call 在 javascript 中，call 和 apply 都是...

zombieda 2019-08-23 15:27 評論0 收藏0
this總結【2】—— call/apply和bind

摘要：和概覽我們要將歸為一類，單獨歸為一類三者的共同點是都可以指定和都是綁定在的原型上的，所以的實例都可以調用這三個方法至于為什么，看完這篇文章你就懂了如果你不懂什么是實例的話，請移步深入淺出面向對象和原型概念篇深入淺出面向對象和原型概念篇第一個 1.call/apply和bind概覽我們要將call/apply歸為一類，bind單獨歸為一類三者的共同點是都可以指定this call/...

wudengzan 2019-08-26 11:48 評論0 收藏0
前端基礎:call,apply,bind的的理解

摘要：和區別其實他們的作用是一樣的，只是傳遞的參數不一樣而已。接受個參數，第一個參數指定了函數體內對象的指向，第二個參數為數組或者一個類數組。看個栗子一個有意思的事在中，多次是無效的。而則會立即執行函數。背景前兩天在做小程序的需求的時候用到bind的時候才想起自己對這三的東西的了解比較淺薄，這個時候用的時候就有點怕。時候還是要好好學習下，理解下怎么玩。正文先說call 和 apply...

netmou 2019-08-20 17:01 評論0 收藏0
javascript關于this 以及this的顯示設置(apply、call、bind)

摘要：如果連續呢結果會是什么結果還是第一個原因是，在中，多次是無效的。更深層次的原因，的實現，相當于使用函數在內部包了一個，第二次相當于再包住第一次故第二次以后的是無法生效的。 this 1.其實js中的this沒那么難理解，當找不到this時記住一句話：誰調我，我就指誰！new 誰指誰 function text1(){ console.log(this); //指wind...

LiveVideoStack 2019-08-21 11:20 評論0 收藏0
理解 JavaScript call()/apply()/bind()

摘要：理解文章中已經比較全面的分析了在中的指向問題，用一句話來總結就是的指向一定是在執行時決定的，指向被調用函數的對象。與和直接執行原函數不同的是，返回的是一個新函數。這個新函數包裹了原函數，并且綁定了的指向為傳入的。理解 JavaScript this 文章中已經比較全面的分析了 this 在 JavaScript 中的指向問題，用一句話來總結就是：this 的指向一定是在執行時決定的，...

duan199226 2019-08-23 14:27 評論0 收藏0