久久久久无码精品,四川省少妇一级毛片,老老熟妇xxxxhd,人妻无码少妇一区二区

Javascript中call與apply的學(xué)習(xí)筆記示例

時(shí)間:2020-11-17 09:59:51 JavaScript 我要投稿

Javascript中call與apply的學(xué)習(xí)筆記示例

  先看MDN中對(duì)于call的解釋

Javascript中call與apply的學(xué)習(xí)筆記示例

  call() 方法在使用一個(gè)指定的this值和若干個(gè)指定的參數(shù)值的前提下調(diào)用某個(gè)函數(shù)或方法.

  注:該方法的作用和 apply() 方法類似,只有一個(gè)區(qū)別,就是call()方法接受的是若干個(gè)參數(shù)的列表,而apply()方法接受的是一個(gè)包含多個(gè)參數(shù)的數(shù)組。

  語法

  fun.call(thisArg[, arg1[, arg2[, ...]]])

  參數(shù)

  thisArg

  在fun函數(shù)運(yùn)行時(shí)指定的this值。需要注意的是,指定的this值并不一定是該函數(shù)執(zhí)行時(shí)真正的this值,如果這個(gè)函數(shù)處于非嚴(yán)格模式下,則指定為null和undefined的this值會(huì)自動(dòng)指向全局對(duì)象(瀏覽器中就是window對(duì)象),同時(shí)值為原始值(數(shù)字,字符串,布爾值)的this會(huì)指向該原始值的自動(dòng)包裝對(duì)象。

  arg1, arg2, ...

  指定的參數(shù)列表。

  MDN上的例子一開始并不是很好理解,這里我貼出來,有興趣可以自己去看看 call-Javascript

  這里的thisArg解釋為在fun運(yùn)行時(shí)指定的this值,也就是說使用了call后,fun中的this指向了thisArg?看代碼

  var p="456"; function f1(){ this.p="123"; } function f2() { console.log(this.p); } f2(); //456 f2.call(f1()); //123 f2.apply(f1()); //123

  第一次輸出是調(diào)用的全局變量,之后由于call和apply的使用,f2中的this指向了f1,因此,輸出變成了123,其實(shí)也就是f1借用了f2的方法輸出了自己的p

  這時(shí)將f1()中的this.p刪除,會(huì)輸出三個(gè)456,也就證實(shí)了當(dāng)this為null或者undefined時(shí)其實(shí)指向了全局變量

  至于指向原始值是指向它的包裝對(duì)象這里,由于我理解的.包裝對(duì)象都是臨時(shí)的,而且測(cè)試時(shí)只輸出了原始值的類型而不是object,這里如何證明如果有知道的朋友希望可以和我討論下,謝謝!

  既然call可以實(shí)現(xiàn)一個(gè)對(duì)象借用另一個(gè)對(duì)象,不就可以實(shí)現(xiàn)繼承了么?看代碼

  function f1(){ this.father="father" } function f2() { f1.call(this); this.child="child"; } var test=new f2(); console.log(test.father); //father

  test中是沒有father的,由于f2()中的

  f1.call(this);

  這里的this指向的就是f2,也就是f2借用了f1的方法,其實(shí)也就實(shí)現(xiàn)了繼承

  下面講一下這里的參數(shù),這里的參數(shù)是傳遞給fun的,看代碼吧

  function f1(){ this.p="123"; } function f2(x) { console.log(this.p); console.log(x); } f2.call(f1(),456); //123 //456

  先輸出123是因?yàn)閒1中的p,之后的456是傳遞給f2的參數(shù),很容易理解

  主要是注意call和apply中參數(shù)的區(qū)別

  call是一個(gè)一個(gè)傳入的,而apply是傳入的一個(gè)數(shù)組

  function f1(){ this.p="測(cè)試call"; } function f2(x,y,z) { console.log(this.p); console.log(x); console.log(y); console.log(z); } function f3(){ this.p="測(cè)試apply"; } f2.call(f1(),4,5,6); f2.call(f1(),[4,5,6]); f2.apply(f3(),[4,5,6]); f2.apply(f3(),4,5,6);

  這里可以看到結(jié)果

  第一段測(cè)試call是正確輸出

  第二段測(cè)試call由于傳入數(shù)組,所以先輸出一個(gè)數(shù)組然后兩個(gè)undefined

  第三段測(cè)試apply正確輸出

  第四段由于參數(shù)格式錯(cuò)誤直接報(bào)錯(cuò)

  這里的區(qū)別應(yīng)該很明顯了