发布于 2017-04-21 16:28:31 | 47 次阅读 | 评论: 0 | 来源: 网友投递

这里有新鲜出炉的Javascript教程,程序狗速度看过来!

JavaScript客户端脚本语言

Javascript 是一种由Netscape的LiveScript发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如Perl,遗留的速度问题,为客户提供更流畅的浏览效果。


经常看到这俩哥们,看来看去都是讲他们的区别,一直没搞太清楚作用究竟是什么,现在记录下自己理解,有错的话希望指出!

先看MDN中对于call的解释

call() 方法在使用一个指定的this值和若干个指定的参数值的前提下调用某个函数或方法.

注:该方法的作用和 apply() 方法类似,只有一个区别,就是call()方法接受的是若干个参数的列表,而apply()方法接受的是一个包含多个参数的数组。

语法


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

参数
thisArg

在fun函数运行时指定的this值。需要注意的是,指定的this值并不一定是该函数执行时真正的this值,如果这个函数处于非严格模式下,则指定为null和undefined的this值会自动指向全局对象(浏览器中就是window对象),同时值为原始值(数字,字符串,布尔值)的this会指向该原始值的自动包装对象。

arg1, arg2, ...

指定的参数列表。

MDN上的例子一开始并不是很好理解,这里我贴出来,有兴趣可以自己去看看 call-Javascript

这里的thisArg解释为在fun运行时指定的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

第一次输出是调用的全局变量,之后由于call和apply的使用,f2中的this指向了f1,因此,输出变成了123,其实也就是f1借用了f2的方法输出了自己的p

这时将f1()中的this.p删除,会输出三个456,也就证实了当this为null或者undefined时其实指向了全局变量

至于指向原始值是指向它的包装对象这里,由于我理解的包装对象都是临时的,而且测试时只输出了原始值的类型而不是object,这里如何证明如果有知道的朋友希望可以和我讨论下,谢谢!

既然call可以实现一个对象借用另一个对象,不就可以实现继承了么?看代码


 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的方法,其实也就实现了继承

下面讲一下这里的参数,这里的参数是传递给fun的,看代码吧


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

先输出123是因为f1中的p,之后的456是传递给f2的参数,很容易理解

主要是注意call和apply中参数的区别

call是一个一个传入的,而apply是传入的一个数组


  function f1(){ 
  this.p="测试call"; 
 } 
 function f2(x,y,z) { 
  console.log(this.p); 
  console.log(x); 
  console.log(y); 
  console.log(z); 
 } 
   function f3(){ 
  this.p="测试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);

这里可以看到结果

第一段测试call是正确输出

第二段测试call由于传入数组,所以先输出一个数组然后两个undefined

第三段测试apply正确输出

第四段由于参数格式错误直接报错

这里的区别应该很明显了



相关阅读 :
Javascript中call与apply的学习笔记
有关JavaScript中call()和apply() 的一些理解
在JavaScript中call()与apply()区别
javascript中call和apply的用法示例分析
Javascript中call,apply,bind方法的详解与总结
浅谈javascript中call()、apply()、bind()的用法
Javascript中call和apply函数的比较和使用实例
基于JavaScript实现继承机制之调用call()与apply()的方法详解
详解js中call与apply关键字的作用
实例讲解JavaScript中call、apply、bind方法的异同
javascript之call,apply的区别
JavaScript中SetInterval与setTimeout的用法详解
最新网友评论  共有(0)条评论 发布评论 返回顶部

Copyright © 2007-2017 PHPERZ.COM All Rights Reserved   冀ICP备14009818号  版权声明  广告服务