原生js实现内置对象Array的concat方法

业务分析

• 我们先要熟悉 内置对象Array的concat()方法 来到这里相信你对这个方法也挺了解的了

// 基本用法展示
 var arr = [1, 2];
 arr.concat(1, [1, 2, 3]);

1. 参数数量可以是任意个数
2. 参数类型可以是数组、字符串、数值

• 我们原生js想要的效果 MyArray.concat(arr,1,[1,2,3])

1. 调用自定义对象 MyArray里面的concat方法
2. 参数：第一个参数必须是一个现有的数组，类似 arr.concat(1, [1, 2, 3])里面的arr；然后接下的参数跟 arr.concat() 的参数使用方法是一样的
3. 分析两者参数的区别： 就是把arr.concat()的arr当作 MyArray.concat()的第一个参数,其他的没区别

• 代码分析与实现

1. 首先我们创建一个函数

 function concat(){}

2. 因为函数的参数的个数我们不确定,所有我们可以使用到 arguments对象
3. 分析 数组链接的实例 假如把数组 arr=["a","b"]与 1和[1,2] 链接, 步骤如下:

 ["a","b"]--> ["a","b",1]-->["a","b",1,1]-->["a","b",1,1,2]

4. 通过上面步骤可知: 要把 1和[1,2] 一个一个分开来 即:1,1,2

   function concat() {
         // 首先我们把拿到arguments里面的所有元素（除了第一个）
         for (var i = 1; i < arguments.length; i++) {
           // 因为arguments的所有元素的类型不一致，所以我们需要判断
           if (Array.isArray(arguments[i])) {//如果参数是数组
           
             // 则要拿到该数组的每一个元素
             for (var j = 0; j < arguments[i].length; j++) {
               console.log(arguments[i][j]);
             }
             
           } else { //  如果不是数组，直接用即可
             console.log(arguments[i]);
           }
         }
       };
 // 可以尝试一下 调用函数并且传进几个类型不同的参数 （此处只是尝试一下能不能拿到每一个元素）
 concat(arr, "a", [1, 2, 3], 1); //会拿到 a,1,2,3,1      

5. 我们应该每次拿到一个元素就马上把这个元素添加到 数组arr的最后面; 此处举例的arr 即是 arguments[0],也就是我们传第的第一个参数

  function concat() {
       var newArr = arguments[0];
       for (var i = 1; i < arguments.length; i++) {
         if (Array.isArray(arguments[i])) {
           for (var j = 0; j < arguments[i].length; j++) {
             //   console.log(arguments[i][j]);
             newArr[newArr.length] = arguments[i][j];
           }
         } else {
           // console.log(arguments[i]);
           newArr[newArr.length] = arguments[i];
         }
       }
       // 最后返回拼接完的数组
       return newArr;
     }

6. 最后我们把 第5处的代码赋值给MyArray对象的concat即可

 var MyArray = {
       concat: function () {
         var newArr = arguments[0];
         for (var i = 1; i < arguments.length; i++) {
           if (Array.isArray(arguments[i])) {
             for (var j = 0; j < arguments[i].length; j++) {
               //   console.log(arguments[i][j]);
               newArr[newArr.length] = arguments[i][j];
             }
           } else {
             // console.log(arguments[i]);
             newArr[newArr.length] = arguments[i];
           }
         }
         // 最后返回拼接完的数组
         return newArr;
       },
     };

7. 最后我们用我们的方法实现一下数组拼接

 var arr = [1, 2, "a"];
 var arr1 = MyArray.concat(arr, 1, "b", [1, 2, "a", "b"]);
 console.log(arr1) 
 //输出 [1, 2, "a", 1, "b", 1, 2, "a", "b"]
``