js 数组

Posted 2022-03-28 lixiuming521125

一、数组的声明：

1 /* 声明数组 */
2 var arr1 = [];//数组字面量；
3 var arr2 = new Array();//通过系统内置的Array构造函数声明数组，一般不使用
4 var arr3 = Array();//可以创建数组，一般不使用
5 console.log(arr1.__proto__);
6 console.log(arr2.__proto__);
7 console.log(arr3.__proto__); //Array
8 //所有的对象都继承于 Array.prototype

 对比与对象的声明：

1 /* 对象 */
2 var obj1 = ;//字面量声明对象；
3 var obj2 = new Object();//
4 var obj3 = Object();//
5 console.log(obj1.__proto__);
6 console.log(obj2.__proto__);
7 console.log(obj3.__proto__);//Object
8 //所有的对象都继承于 Object.prototype

对比 对象的访问

 1 var array = [1,2,3,4,5];
 2 //index 数组元素的下标（索引值）
 3 var object = 
 4         0:1,
 5         1:2,
 6         2:3,
 7         3:4,
 8         4:5
 9         
10 
11 console.log(array[2],object[2])

这里 array[2] 和 object[2]的结果是一样的；这里可不可以说，数组也是一种对象呢？数组也继承了 Object.prototype;

二、数组的访问 增 改 查：

 1  /* 数组访问 */
 2  //读：
 3  var arr = [1,2,3,4,5]
 4  console.log(arr[5]);//undefined ;这里的undefi 和 empty 的区别就是，empty是元素
 5 //相当于：
 6 var obj = 
 7          0:1,
 8          1:2,
 9          2:3,
10          3:4
11  
12 console.log(obj[4])
13 
14 //写：
15 arr[4] = "a";
16 //改
17  arr[0] = "b";

数组的其他（增）方法；

1.在数组的前面添加数据 使用 unshift(在原数组上更改);

2.在数组的后面添加数据 使用 push(在原数组上更改);

1 /* 方法 push unshift 
2 *    继承于 Array 原型上的 push unshift方法
3 */
4 var arr = [2,3,4]
5 console.log(arr.push(5,6));//5,返回值是 执行push后的新的数组的长度
6 console.log(arr)//2,3,4,5，6
7 console.log(arr.unshift(0,1));//在数组前面，添加 0，1， 结果为7
8 console.log(arr);//0,1,2,3,4,5,6

数组的 删除方法 （以下代码 是接着上面代码的，即第5行的 arr 是 上面 增方法的 变量）：

1.删除数组首位数据 使用 shift(在原数组上更改);;

2.删除数组末尾数据  使用pop(在原数组上更改);;

1 /* pop 和 shift 
2  * 
3  */
4  
5  arr.pop()// 返回数组的末位 值 
6  console.log(arr);//0，1，2，3，4，5
7  arr.shift()// 0 返回数组的首位 值 
8  console.log(arr);//1，2，3，4，5

数组的 修改方法 ：

splice(在原数组上更改); 和 sclice (不在原数组上更改);容易混淆；大家可以把这两段代码放入浏览器 console 里面运行一下，看结果；

 1 /**
 2  *splice
 3  * arr.splice(开始位置，剪切长度，剪切的最后一位添加数据)
 4  */
 5  
 6  var arr = ["a","b","c"];
 7  arr.splice(1,2);
 8  console.log(arr);//a
 9  
10  var arr = ["a","b","c"];
11  arr.splice(1,1,1,2,3);
12  console.log(arr);
13  arr.splice(-1,0,"d");
14  console.log(arr);

 1  /* slice：剪切获取值的区间为 [start,end)
 2  splice  arr.splice(开始位置，剪切长度，剪切的最后一位添加数据); 剪切掉的的区间为：[开始位置，剪切长度]
 3  
 4  */
 5  var arr = ["a","b",‘c‘,"d","e","f"];
 6  var arr1 = arr.slice();//slice(a,b);区间为 [start,end)
 7  console.log(arr1);//复制原数组
 8  var arr2 = arr.slice(1);//["b",‘c‘,"d","e","f"];下标为1到结尾；
 9  var arr3 = arr.slice(-3,5);
10  var arr4 = arr.slice(-3,-2);
11  var arr5 = arr.slice(1,5);
12  console.log(arr3);
13  console.log(arr4);
14  console.log(arr5);

解析：上面的splice的代码段：第一console.log 的结果是 a;原因就是 ：

["a","b","c"];
       ↑  → ↑ 
(start) 1  2  2（end）

如上示意，开始位置是a[1],长度是2，剪切是闭区间剪切 即剪掉 a[1],a[2]；所以结果就是 [‘a‘];
 同理 var arr = ["a","b","c"]; arr.splice(1,1,1,2,3);这个的结果呢？
["a","b","c"]

　　　 ↑^(insert)1,2,3

   (start)1(end)

如上示意，开始位置是 a[1], 剪切掉长度为 1为 ，剪切区间为闭区间，即剪掉的是 a[1] ; 在减掉的最后一位插入数据的数据 1，2，3;即 a[1] = 1;　　a[2] = 2;　　a[3] = 3; 　　所以最后的结果是

[‘a‘,1,2,3,"c"];

同理arr.splice(-1,0,"d");  console.log(arr);的结果呢？

这里需要搞清楚 起始位置是a[-1] ;-1，即倒着数，a[0]是首位, a[-1]即末位； 0，即剪切的长度为0，插入数据为 ‘d‘，即 在a[-1]的位置插入 ‘d’,结果为：[‘a‘,1,2,3,‘d‘,"c"];

解析：下面的sclice的代码段：

 

sclice不是对原数组的一个操作，他返回的是截取数组的长度；这里解释一个 var arr3 = arr.slice(-3,5); console.log(arr3);截取的位置是 a[-3] 到 a[5]; 即a[-3] = d 到 a[5] = f,截取区间为闭区间，所以截取的结果是：
["d","e"];

三、数组的排序
1.sort方法排序；

 1 /* sort
 2  sort 默认是按照 ASCII排序的；
 3  */
 4  var arr = [-1,-5,8,2];
 5  arr.sort();
 6  console.log(arr);//对应实际的ASCII排序，
 7  
 8  var arr = ["b","z","h","i","a"]
 9  arr.sort();
10  console.log(arr);
11  
12  var arr = [27,49,5,7];
13  arr.sort();
14  console.log(arr);//这里排序失效了，原因是 他还是按照ascii 排序了；
15  //自定义排序  1.参数 必须是两个；
16  //　　　　　　2.必须有返回值  若负值，a 在前 ，正数，b在前，0 ：保持不动
17  arr.sort(function(a,b)
18     return a-b;
19  )
20  console.log(arr);//正序排列
21  
22  //随机排序
23  var arr = [1,2,3,4,5,6] 
24  arr.sort(function(a,b)
25      var rand = Math.random();//产生 （0，1）开区间的数据
26      /* if(rand -0.5>0)
27          return 1;
28      else
29          return -1
30       */
31      return rand-0.5;
32  )
33  console.log(arr);
34  
35  var arr = [
36      son:"joy",age:18,
37      son:"ben",age:13,
38      son:"lucy",age:15,
39      son:"jenny",age:20,
40      son:"jone",age:12,
41      son:"leo",age:1
42      ]
43  arr.sort(function(a,b)
44      if(a.age>b.age)
45          return 1;
46      else
47          return -1
48      
49  )
50  
51  console.log(arr);
52  
53  
54  var arr = ["12345","1","111"];
55  arr.sort(function(a,b)
56      if(a.length>b.length)
57          return 1
58      else
59          return -1;
60      
61  )
62  console.log(arr);

2.数组倒叙:reverse

1 var arr = [1,2,3,4]
2 console.log(arr.reverse())//[4, 3, 2, 1]

四 其他方法

1.合并两个数组 concat

1  /* concat 合并两个数组 */
2 var arr1 = ["a","b",‘c‘];
3 var arr2 = ["d","e","f"];
4 var arr3 = arr1.concat(arr2);
5 console.log(arr3);

2.joint ,split

1  /* join() 参数就是函数的分隔符
2      split() 第一个参数， 分割的符号，第二个参数是 得到数组长度；
3  */
4  var arr = ["a","b",‘c‘,"d","e","f"];
5  var str1 = arr.join();//数组变字符串，str1 = "a,b,c,d,e,f"
6  var str2 = arr.toString();//"str2 = a,b,c,d,e,f"
7  var str3 = arr.join("-");////数组变字符串 并且以 ‘-‘连接 str3 = "a-b-c-d-e-f"
8  var arr1 = str3.split("-");//arr1 = ["a","b",‘c‘,"d","e","f"];
9  console.log(str1,str2,str3,arr1);

五、扩展方法

1.数组去重

 1 //数组去重
 2  var arr = [0,0,2,1,"a","a","b","b"];
 3  Array.prototype.unique = function()
 4      var temp = ;
 5      newArr = [];
 6      for(var i=0;i<this.length;i++)
 7          if(!temp.hasOwnProperty(this[i]))
 8              temp[this[i]] = this[i];
 9              newArr.push(this[i])
10          
11      
12      return newArr;
13  
14  var obj = 
15          name :‘123‘,
16          name:"123"
17  
18  console.log(obj);//只打印出一个属性来
19  console.log(arr.unique());
20  
21  //字符串去重
22  var str = "11122222222222223333";
23  String.prototype.unique = function()
24      var temp = ;
25      var newStr = "";
26      for(var i = 0;i<this.length;i++)
27          if(!temp.hasOwnProperty(this[i]))
28              temp[this[i]] = this[i];
29              newStr += this[i] 
30          
31      
32      return newStr;
33  
34  console.log(str.unique());

2.类数组

 1 //类数组 原型对应是 Object,有下标值，有length属性,需要挂push，则挂,有splice
 2 function test()
 3     //arguments.push(7);报错
 4     console.log(arguments)
 5 
 6 test(1,2,3,4,5);
 7 var obj = 
 8         "0":1,
 9         "1":2,
10         "2":3,
11         "3":4,
12         "4":5,
13         "length":5,
14         "push":Array.prototype.push,
15         "splice":Array.prototype.splice//可以变成数组的样式
16 
17 obj.push(7)
18 console.log(obj);
19 
20 
21 //push原理
22 Array.prototype.push=function(elem)
23     this[this.length] = elem;
24     this.length++;
25 
26 //阿里面试题
27 var obj1 = 
28         "2":3,
29         "3":4,
30         "length":2,
31         "push":Array.prototype.push,
32         "splice":Array.prototype.splice//可以变成数组的样式
33 
34 obj1.push(1);
35 obj1.push(2);
36 console.log(obj1)
37 
38 var person = 
39     "0":"张小一",
40     "1":"张小二",
41     "2":"张小三",
42     "name":"张三",
43     "age":5,
44     "weight":140,
45     "height":180,
46     "length":3,
47     "push":Array.prototype.push,
48     "splice":Array.prototype.splice//可以变成数组的样式
49 
50 /* Object.prototype.push = Array.prototype.push;
51 Object.prototype.splice = Array.prototype.splice; */
52 console.log(person);
53 console.log(person.length)