[].slice.call()的思考和扩展

1.[].slice.call()的思考

let arrayLike = {
    '0': 'a',
    '1': 'b',
    '2': 'c',
    length: 3
};
let arr1 = [].slice.call(arrayLike);
arr1 //['a','b','c']

分析:
[].slice是一个函数,函数可以调用call方法.
通过call(),认arrayLike具有数组slice方法,而数组slice()会返回数组,间接认arrayLike调用slice()后最终返回数组
假如认call()带上参数如:
let arr2 = [].slice.call(arrayLike, 1, 2); //['b']
与下面这行代码运行结果是一样
let arr3 = ['a','b','c'].slice(1,2) //['b']
可以发现call()的第二参数和第三参数是arrayLike调用slice()时传给slice()的参数

那为什么arr1结果为['a','b','c'],而不是['a','b']或其它呢?
运行下面代码:
let arr4 = [].slice.call(arrayLike, 0, 0);  //['a','b','c']
let arr5 = [].slice.call(arrayLike)  //['a','b','c']
通过对比arr4和arr5发现,如果call()不传第二,三参数.js默认都是0,所以会返回['a','b','c']

2.[].slice.call()的扩展

* [].join.call(arrayLike) // a,b,c
   结果得到字符串"a,b,c".因为数组join()就是返回字符串.也可以传参
  [].join.call(arrayLike, '|') // a|b|c

  //push(元素)是往数组尾部插入元素
* let arr6 = [].push.call(arrayLike, 'd'); //4
  arr6表示arrayLike的长度length
  而arrayLike变为 {0: "a", 1: "b", 2: "c", 3: "d", length: 4}

* 通过以下四个函数,应该可以间接实现对象做成队列效果.本人暂没详细测试.有机会再深入下
    [].push.call(),
    [].pop.call(),
    [].unshift.call(),
    [].shfit.call()

* [].sort.call() 可以认json对象排序.
    let arrayLike1 = {
        '0': 'c',
        '1': 'a',
        '2': 'b',
        length: 3
    };
    let arr7 = [].sort.call(arrayLike1); //{0: "a", 1: "b", 2: "c", length: 3}

* [].reverse.call() 还是以arrayLike1为例
    let arr8 = [].reverse.call(arrayLike1); //{0: "b", 1: "a", 2: "c", length: 3}

* [].concat.call() 传个参数比较明白
    let arr9 = [].concat.call(arrayLike1, 'd');
    结果为:[{'0': 'c','1': 'a','2': 'b',length: 3}, 'd']

* [].splice.call()
    let arr10 = [].splice.call(arrayLike1, 1, 1);
    arr10结果为 ['a']表示要删除的元素
    arrayLike1结果为 {0: "c", 1: "b", length: 2}

* [].indexOf.call() 
    let arr11 = [].indexOf.call(arrayLike1, 'a') // -1
    let arr12 = [].indexOf.call(arrayLike1, 'a') // 1

* [].lastIndexOf.call类上

转载于:

https://blog.csdn.net/u010841017/article/details/78990257

猜你喜欢

转载自blog.csdn.net/qq_36926807/article/details/81513023