zoukankan      html  css  js  c++  java
  • [].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

  • 相关阅读:
    ES6 Set
    JavaScript 之 对象属性的特性 和defineProperty方法
    ES6 ... 展开&收集运算符
    ES6 箭头函数
    ES6 解构 destructuring
    canvas之事件交互效果isPointPath
    跨域及JSONP原理
    P03 显示隐藏
    最长公共子序列
    P02 CSS样式
  • 原文地址:https://www.cnblogs.com/july-lin/p/9888430.html
Copyright © 2011-2022 走看看