1. 程式人生 > >call,apply,bind的區別

call,apply,bind的區別

以下例子都以這個物件為基礎

var people = {
    user: "zhengwenlong",
    getAge: function (birth) {
        var date = new Date;
        console.log(this.user +':'+ (date.getFullYear() - birth))
    }
};

單純呼叫獲得年紀這個方法:

people.getAge(1993);  //zhengwenlong:24

上面程式碼如我們所願,能打印出來zhengwenlong:24(當然,只有你本機時間是2017年的時候)

接著換一種方法來試一下:

var p = people.getAge;
    p(1993); //undefined:24

名字哪兒去了?咋成了undefined?這裡就又要開始說this了,呼叫p的時候this指向到了window,window下沒有user啊,所以就成了undefined

這裡可以驗證一下這個說法是否成立

在定義people這個物件之前先定義一個master

var user = "master"
var people = {
    user: "zhengwenlong",
    getAge: function (birth) {
        var date = new
Date; console.log(this.user +':'+ (date.getFullYear() - birth)) } }; var p = people.getAge; p(1993); //master:24

打印出來master:24,沒毛病

雖然有方法來實現這個檢視年紀的方法,但是有些時候不得不把這個物件儲存到另外的一個變數中的時候,可以通過以下方法

一、call

var p = people.getAge;
p.call(people, 1993)//zhengwenlong:24

這個也能很好的呼叫到people物件內部的變數及方法

call方法能改變函式執行的上下文,也就是this的指向,第一個引數就是你希望的this指向,後面的引數是你呼叫的這個函式的裡面需要傳的值,這裡可以傳多個值
你也可以這樣

//只做示例
var p = people.getAge;
p.call(people, 1993, 11, 02);

二、apply

apply的用法和call基本類似,只不過後面的引數以陣列形式傳遞,數組裡面對應的就是函式裡面接受的引數

//只做示例
var p = people.getAge;
p.call(people, [1993, 11, 02]);

如果call和apply的第一個引數寫的是null,this指向的是window物件

三、bind (ES5)

var p = people.getAge;
b = p.bind(people, 1993);

what?為啥控制檯什麼也沒有,我們來看看這個b到底是個什麼鬼?
來試一下

var p = people.getAge;
var b = p.bind(people, 1993);
console.log(b);
//ƒ (birth, a) {
//    console.log(birth, a)
//    var date = new Date;
//    console.log(this.user + ':' + (date.getFullYear() - birth))
//}

soga,b原來是一個函式,那我們就只好這樣來用了

var p = people.getAge;
var b = p.bind(people, 1993);
b();//zhengwenlong:24

當然也是可以傳多個值的

//只做示例
var p = people.getAge;
var b = p.bind(people, 1993, 12, 09);
b();

還能這樣用

//只做示例
var p = people.getAge;
var b = p.bind(people, 1993);
b(12, 09);//根據接收的引數順序往後排列

相關推薦

數組去重callapplybind之間的區別this用法總結

步驟 -- 之間 undefined 定義 ply clas turn 需要 一、數組去重,直接寫到Array原型鏈上。 1 //該方法只能去除相同的數字 不會去判斷24和‘24‘是不同的 所有數字和字符串數字是相同是重復的 2 Array.prototype

深入瞭解new的過程callapplybind區別

話不多數,直接上程式碼 1 //1、new的過程發生了什麼 2 function create () { 3 //建立了一個物件 4 var obj = new Object() 5 //獲取建構函式 6

callapplybind區別模擬callapplybind的實現

bind:bind繫結完this的指向後會返回一個新的函式體,不會被立即呼叫   call&apply:繫結完this的指向後會立即呼叫   call與apply的區別:     call:第一個引數是this的指向,

callapplybind區別專講

ply 默認 app UNC proto 函數名 實參 拖拽 焦點   可以幹什麽?   改變函數內的this指向;   什麽時候使用?   構造函數使用this   為什麽使用?   為了生成對象   類(函數名不可以帶括號).call() 因為this指向對象

callapplybind區別

以下例子都以這個物件為基礎 var people = { user: "zhengwenlong", getAge: function (birth) { var date = new Date; console

callapplybind 的使用思路

spa obj ply name cal bound add his urn call 與 apply 的區別是 cal 只能一個一個的傳遞參數,apply 是可以通過數組來傳遞參數, bind 需要進行一次額外的聲明, call 實例 var arr = {num:

閉包閉包用途callapplybind 的用法

聲明 func 相互 function span all this 內存 bsp 什麽是閉包:“函數”和“函數內部能訪問到的變量(也叫環境)”的總和,就是一個閉包。JavaScript有兩種作用域:全局作用域和函數作用域。函數內部可以直接讀取全局變量。但是,在函數外部無法讀

js中call apply bind的自我心得

apply 和 call 的區別 apply和call: apply和call作用相同,只是在傳參上面有點小差別,兩個方法一個是將呼叫函式中的引數放在一個數組中傳過去,一個是一個一個傳過去。 這裡用apply方法做講解,apply方法傳入兩個引數:一個是作為函式上下文的物件

callapplybind詳解

本來這些內容是寫在this指向那篇部落格中的,但發現面試筆試中這個知識點出現的機率很高,所單獨拿出來講解一下。 一.call和apply call和apply其實是同一個東西,區別只有引數不同,call是apply的語法糖,所以就放在一起說了,這兩個方法都是定義在函式物件

深入理解 callapplybind

在JavaScript 中,call、apply 和 bind 是 Function 物件自帶的三個方法,這三個方法的主要作用是改變函式中的 this 指向,從而可以達到`接花移木`的效果。本文將對這三個方法進行詳細的講解,並列出幾個經典應用場景。 1、call(thi

js的this指標指向誰以及相關的callapplybind方法

1、誰作為呼叫者就指向誰 function a() { console.log(this); } //下面a方法的呼叫,其實在js中等於window.a(),也就是window呼叫了a()方法,所以a方法中的this指向了window a(

詳解call()apply()和bind()

  之前看了點es6的箭頭函式,為了搞懂箭頭函式的this,看了很多文章,也順便看了幾個繫結函式,發現很多以前沒注意的問題,收穫不少。   之前就在網上的筆試題中看過用js實現bind()函式,沒怎麼在意,以為既然都是用來進行上下文繫結的,用call或者apply應該就能實

JavaScript裡callapplybind方法簡介

JavaScript裡call,apply,bind方法不太容易理解,其實背後的思想並不算非常複雜,希望本文能幫你更好地瞭解這3個很像,而且看似很神祕的方法。 非要用一個關鍵字來點明它們的背後思想的精髓的話,關鍵字就是:this 因為通常程式設計師對C++比較熟,先借用C

call() 、 apply() 、bind()方法的作用和區別

調用 權威指南 () 使用 func 開始 把他 對象 bsp 從一開始,我是在書上看到關於bind()、call() 和 apply(), 不過長久以來,在工作中與網上接觸到了很多關於這三個方法的使用場景,對這三個方法也算是比較熟悉了。所以把他們的作用和區別簡單闡述一下!

js學習總結----callapplybind區別

style 效果 兩個 是我 define 學習 處理 blog call() apply和call的方法是一模一樣的,都是用來改變方法的this關鍵字,並且把方法執行:而且在嚴格模式和非嚴格模式下對於第一個參數是null/undefined這種情況的規律是一樣的; bin

callapplybind區別

function all his sar ... cal tro ont size 在 javascript 中,call 和 apply 都是為了改變某個函數運行時的上下文(context)而存在的,換句話說,就是為了改變函數體內部 this 的指向。 JavaScri

callapplybind方法的用法以及區別

方法呼叫模式: 當一個函式被儲存為物件的一個方法時,如果呼叫表示式包含一個提取屬性的動作,那麼它就是被當做一個方法來呼叫,此時的this被繫結到這個物件。 var a = 1 var obj1 = { a:2, fn:function(){

call()和apply()、bind()方法的區別;對Array.prototype.slice.call()方法的理解

1、call()和apply()就是改變函式的執行上下文,也就是this值。他們兩個是Function物件的方法,每個函式都能呼叫。 function apply1(num1, num2){     return sum.apply(this, [num1, num2])

JS中callapplybind大概區別

為什麼需要這些?主要是因為this,來看看this乾的好事。 box.onclick = function(){   function fn(){     alert(this);   }   fn(); }; 我們原本以為這裡面的this指向的是box,然

清晰明瞭搞懂 callapplybind區別

文章目錄 直接來看 call 例子: var People = { sayHello: function(arg1) { console.log('你好,' + this.name + ',' + arg1) } } var me = { n