call的其他应用

看一些源码的时候常常发现例如这些的代码

  Array.prototype.slice.call(arg)

  Object.prototype.toString.call(str)

等等 ,着一些系列的句子,当时的我内心是这样的

问题总是要解决的,各种百度  有木有

最后在网上看到一个大牛的博客,他这样写到

1     var fun=function () {
2         console.log(this); //String {0: "m", 1: "e", 2: "n", 3: "g", length: 4, [[PrimitiveValue]]: "meng"}
3         console.log(this instanceof  String);  //true
4     };
5     fun.call("meng");

这段代码执行方式不难看出,就是this指向了字符串"meng"。

注意这里,我并没有说把"meng"传入到到了方法fun中

在看如下代码

1    var fun=function (value) {
2         console.log(value); //undefined
3     };
4     fun.call("meng");

返回的结果是undefined,也就是说,只是指向了,并没有“处理”参数,其实想想call的用法,它也该如此。。

好了,基础演戏看完了,各位看官想必也明白了,最后再看下代码的执行效果吧

1     var obj = {length: 2, 0: "first", 1: "two"};
2     var result = Array.prototype.slice.call(obj);
3     console.log(result);  //["first", "two"]
4     result = Object.prototype.toString.call(obj);
5     console.log(result);  //[object Object]    

当然也可这样写Array.prototype.slice.call(arg,n)表示从第n项开始截取

这里在补充网上的一种说法:

  slice()方法没有参数的话,会从0开始剪切到最后。

  所以上面的代码可以这样理解,代码从0剪切到1,结果生成数组,对应的结果就如上了。。

  其实这样说的前提是,你得理解slice内部的方法实现。

最最最终奥义:Object.protype.Fun.call(n,m)这种结构,

  对n执行Fun(m)。

  m不存在,执行Fun默认方法。


思维扩展下,Array.prototype.slice.call(arg)其实可以这样用(临时想到的,感觉可以)

如网上一些数据的解析方式是这样的

用的0,1,2....等数字做的属性名(前两天从php后天获取的数据也是如此),今天学到这个方法后是不是可以这样处理一下

1     var con1=document.querySelector(".con1");
2     var result=window.getComputedStyle(con1);
3     console.log(Array.prototype.slice.call(result[3]).join(""));

当然你也可以这样处理

1     var con1=document.querySelector(".con1");
2     var result=window.getComputedStyle(con1);
3     console.log(result[3]);

返回的结果是一样的

上面的哪一种看着显然麻烦,这里提到主要有两点原因

  1,深刻理解下.call()方法

  2,为解决问题多一种思路

 刚刚又从网上看到了个它的用处

js arguments类型像数组但不是数组,所以也就有了,把arguments转换成数组的方法(插件用它的意义也在于此)

原文地址:https://www.cnblogs.com/chenluomenggongzi/p/5976281.html