数组（Array）

1. 基础知识

1. 创建数组

 1）当构造函数只有一个参数，参数代表数组长度

  new Array(length)
//  或者 
 Array(length)

    length只能是>=0的整数

new Array(3); // [empty *3]
Array(3); // [empty * 3]

2）构造函数有多个参数时，参数为数组的初始值

new Array(1,2) ; // [1,2]
Array(1,2); // [1,2]

3) 推荐： 使用[]

var arr = [1,2,]; // [1,2] 数组的最后一个逗号可以忽略

4) 使用Array.of(参数)， 不管参数个数有几个，参数都是数组的初始值

Array.of() ; // []
Array.of(3); // [3]
Array.of(1,2); //[1,2]

2. 数组键值

　1) a[0] 相当于 a['0']

   a[1.00] --> a['1'] --> a[1]

   2) 如果键值大于数组长度，或者为负数，系统自动将其转为数组对象的字符串属性，

   不再是数组的值。  

var arr = [];
arr[-1] = 5; // 数组对象的属性名为“-1”
arr[2**32] = 34; // 数组对象的属性名为“4294967296”
// [-1: 5, 4294967296: 34]
arr.length;// 0

3.length属性

  1) length = 最大的整数key + 1

  2) length最大值是2**32 - 1，数组长度大于该值报错:RangeError

var arr=[];
arr.length = 2**32; // Uncaught RangeError: Invalid array length

4. in运算符

1） 数字键既可以使用数字，也可以使用字符串

var arr=[1];
'0' in arr; // true
0 in arr;// true

2) 如果是空位，empty，in运算符返回false

var arr = Array(1); // [empty]
var arr2 = [,]; // [empty]
0 in arr; //false
0 in arr2; // false

5.空位

1）空位的产生

注意undefined不是空位

 1  构造函数生成
　　 Array(2); // [empty*2] 2  两个逗号之间为空
　　 [,]; // [empty] 3  delete属性删除某个数组的值之后
　　var a =[1,2,3];
　　delete a[1];
　　a; // [1,empty, 3]

2)空位的遍历

forEach, for...in..., Object.keys()，some(), every(),flat()都会忽略空位；

var arr= Array(3);
arr.forEach(i => {
    console.log(i);
});
// 没有任何输出

map会保留空位

var arr=[1,,4];
arr.map(i => i*2); // [2,,8]

3)空位的填补（将empty转为undefined）

var arr=Array(3);
1. Array.from()方法
Array.from(arr); // [undefined, undefined, undefined]
2. 扩展运算符方法
[...arr]; //[undefined, undefined, undefined]

2. 静态方法

Array.isArray(arr):判断参数是否是数组

Array.isArray([]);// true

Object(obj) === obj可以判断是否是对象

3. 实例方法--- 改变原数组

1. push(param)/push(param1,param2,.....)

  改变原数组，从尾部添加；返回数组长度

var arr=[4];
arr.push(1,2,3); // 4
arr; // [4,1,2,3]

2. unshift(param)/ unshift(param1, param2,...)

  改变原数组，从头部添加；返回数组长度

var arr=[4];
arr.unshift(1,2,3); // 4
arr; // [1,2,3,4]

3.   pop() :没有参数

改变原数组，从尾部删除一个数据；返回删除的数据

var arr=[1,2,3,4];
arr.pop(); // 4
arr;// [1,2,3]

4.shift(): 没有参数

改变原数组，从头部删除一个数据；返回被删除的数据

var arr=[1,2,3,4];
arr.shift(); // 1
arr;// [2,3,4]

5. splice(start, length, addval1,addval2,...)

改变原数组；

当length>0时，从start开始删除，然后将后面的参数插入；返回被删除的数据

当length==0时，从start位置插入，不删除任何数据；返回空数组

当length<0时，不删除，返回空数组；

当start <0时，从倒数位置数；

当length不存在时，默认从起始位置到结束位置,相当于将数组分成两部分；

var arr=[1,2,3,4];
arr.splice(1,1,5); // [2] 删除2,插入5
arr; // [1,5,3,4]
arr.splice(1,0,6); // [] 不删除，插入6
arr;//[1,6,5,3,4]
arr.splice(3); // [3,4] 只删除，不插入
arr; // [1,6,5]

6. reverse()

改变原数组，返回反转后的数组

var arr=['a', 'b'];
arr.reverse(); //['b','a']
arr; //['b', 'a']

7.sort()/sort(function)

默认按照字典顺序排序，即所有的元素按照字符串排序；

还可以传入排序函数，进行自定义排序；

返回排序后的数组，原数组改变

[1001,101,111].sort(); // [1001,101,111]
// 按照字符串排序的规律进行排序

// 自定义排序函数，按照数值的升序排列
// 函数返回值>0，第二个在前；其余情况都是第一个在前
let arr=[1001,101,111];
arr.sort((a,b) => a-b); // [101,111,1001]
arr;//[101,111,1001]

8. copyWithin(overwriteStart, start=0, end=length)

将[start, end)的数据从第一个参数开始覆盖；返回覆盖后的数组

如果overwriteStart为负数，则从后面开始数；

var arr=[1,2,3,4];
arr.copyWithin(0, 3, 4); // [4,2,3,4]

9.fill(value, start, end)

改变原数组，从start到end被value值填充；返回修改后的数组

如果填充的是对象或者数组，相当于填充地址，一个修改全部修改；

var arr=Array(3);
arr.fill(7); // [7,7,7]
arr.fill(8, 0, 1); //[8,7,7]
arr.fill({a:1}); //[{a:1},{a:1},{a:1}]
arr[0].a = 5;
arr; // [{a:5},{a:5},{a:5}]

4.实例方法--查找/判断数组元素

1. indexOf(value, start)

查找出现的第一个元素，不存在返回-1;

start为负数，倒数

2.lastIndexOf(value, start)

查找出现的最后一个位置，不存在返回-1

3. some(function, thisObj)

判断元素是否存在符合function的条件，是返回true,否则false

var arr=[1,2,3];
arr.some((item,index,arr) => {
   return item>2
}) ;// true

4. every(function, thisObj)

判断是否每个元素都符合funtion的条件，是返回true,否则false

var arr=[1,2,3];
arr.every((item,index,arr) => {
   return item>2
}) ;// false

5.find(function)

传入一个函数作为查找条件，返回查找的结果或者undefined;

功能同indexOf();但是可以查找NaN

6. findIndex(function)

返回查找到的元素所在的index或者-1；

功能同indexOf(); 但是可以查找NaN

7. includes(value)

查找元素是否存在；返回布尔值；

可以查找NaN

5. 实例方法--数组转字符串

1. toString()

会将null, undefined,空位转为空字符串''

但是NaN转为"NaN"

返回以，逗号分割的字符串

[1,2,null,undefined,4].toString(); // "1,2,,,4"

2. join(分割符)

将数组元素以分隔符连接，返回连接后的字符串；

同样将null,undefiend处理成空字符串

如果没有参数，分隔符默认是逗号（，）

[1,2,null,undefined,4].join();// "1,2,,,4"
[1,2,null,undefined,4].join("|"); // "1|2|||4";

6. 实例方法--遍历数组

遍历数组可以使用for,while语句，也可以使用一些内置函数遍历

1. forEach(function, thisObj)

1)会跳过空位，不会跳过undefined和null

2)不返回任何值

2. map(function, thisObj)

1) 会跳过空位，不会跳过undefined和null

2)返回遍历处理过的数组

map方法有时会改变原数组，一般是参数是对象的时候

var a = [{a:1}, {a:2}, {a:3}];
// 遍历的时候，直接改变当前元素的值，会修改原数组
var newArr = a.map((item,index,arr) => {
    item.b = "add";
    return item;
});
newArr;  // [{a: 1, b: "add"}, {a: 1, b: "add"}, {a: 1, b: "add"}]
a; // [{a: 1, b: "add"}, {a: 1, b: "add"}, {a: 1, b: "add"}]
// 如果想避免这种修改原数组的情况，可以将当前元素重新赋值
var newArr = a.map((item,index,arr) => {
    const obj = {...item}; // 浅拷贝
    obj.b = "add";
    return obj;
});
newArr; // [{a: 1, b: "add"}, {a: 1, b: "add"}, {a: 1, b: "add"}]
a; // [{a:1}, {a:2}, {a:3}];

3. filter(function, thisObj)

返回过滤后的新数组

可以使用filter(Bollean)返回布尔值是true的元素

4. reduce(function, initialValue, thisObj)

累计处理数组，可以用来求数组的和

function有四个参数(a,b,index,arr);

当initialValue没有值时，a代表数组第一个元素，b代表数组第二个元素

5.reduceRight(function, initialValue, this.obj)

6.entries() keys() values()

三者都是对数组的遍历。返回的是遍历器对象!!

// entries()是对键值对的遍历
for(let [key,value] of ['a','b'].entries()) {
    console.log(key, value);
}
// 0 'a'
// 1 'b'
for(let keyValue of ['a','b'].entries()) {
    console.log(keyValue);
}
// [0, "a"]
// [1, "b"]

['a','b'].entries().next(); 
//{value: [0,"a"], done: false}


// keys()是对键名的遍历
[...['a','b'].keys()] ; // [0,1]

// values()是对值的遍历
[...[,'a',null]]; // [undefined, 'a', null]

7.实例方法---不改变原数组

1.concat(val1, val2)

参数可以是任意类型的值，返回拼接后的新数组。

var arr=['a', 'b'];
arr.concat('c'); //['a','b','c']
arr; // ['a','b']
arr.concat(['c'], 'd'); // ['a','b','c','d']

2.slice(start, end)

和字符串用法相同

3.flat()/flat(n)

将数组拉平，如果无参数，默认拉平一层；传入n,拉平n层；

如果想拉平所有的层，可以简单使用flat(Infinity)

var arr = [1,[2,[3]]];
arr.flat(); // [1,2,[3]]
arr; // [1,[2,[3]]];
arr.flat(2); //[1,2,3]
arr.flat(Infinity); //[1,2,3]

4. flatMap(function)

原数组不变；对数组使用map方法后拉平，只能拉平一层！

var arr=[1,2,4];
arr.flatMap((item) => [[item]]); //[[1],[2],[4]]
arr; // [1,2,4];

8. 类数组/Iterator接口对象转数组

类数组对象唯一的要求是有个length属性；{length: 3}

Iterator接口对象是部署了Iterator接口的对象；如Set

arguments,NodeList,字符串两种对象都属于。

1.使用slice()方法

只能将类数组对象转为数组；不能将遍历器接口对象转为数组

[].slice.call({length:3}); //[empty*3]

2.扩展运算符(...)

只能将遍历器接口对象转为数组；类数组对象不行

[...new Set([1,2,4])]; //[1,2,4]

3.Array.from(params)

既可以处理类数组对象，也可以处理遍历器接口对象

let arrayLike = {
    '0': 'a',
    '1': 'b',
    '2': 'c',
    length: 3
};
Array.from(arrayLike); // ['a','b','c']
Array.from(new Set([1,1,3])); // [1,3]