1.1 数组及常用方法

**数组的概念及其定义方式**

- 数组：有序的值的集合

```

/**

* 定义数组

defineArray() {

let arr = [1, 2, 3];

let arr1 = new Array();

let arr2 = new Array(10);

let arr3 = new Array(1, 2, 3, 4);

console.log(arr[0]); // 0是数组的索引或者叫下标

console.log(arr.length); // 数组中元素的个数

}

```

### 数组的遍历方法 = 循环

- for循环

- forEach循环：遍历数组中的每一项，没有返回值，对原数组没有影响，不支持IE

- map循环：遍历数组中的每一项，不会改变元素组，并且支持return返回

- for of循环：可以正确响应break、continue和return

- filter：不会改变原始数组，返回新数组

- every:对数组中的每一项给定运行函数，如果该函数的每一项返回true，则返回true

- some:对数组中每一项运行指定函数，如果该函数对任一项返回true，则返回true

- reduce:接收一个函数作为累加器（accumulator），数组中的每个值（从左到右）开始缩减，最终为一个值

- reduceRight:和reduce()功能是一样的，不同的是reduceRight()从数组的末尾向前将数组中的数组项做累加。

- find:遍历去满足某一个条件，返回满足条件的第一个元素，否则返回undefined

- findIndex: 遍历去满足某一个条件，返回满足条件的第一个元素索引，都不满足则返回-1

- for of + keys():用for...of循环进行遍历，唯一的区别是keys()是对键名的遍历

- for of + values():用for...of循环进行遍历，唯一的区别是values()是对键名的遍历

- for of + entries():用for...of循环进行遍历，唯一的区别是entries()是对键名的遍历

```

/**

* for循环

* forEach循环 = 遍历数组中的每一项，没有返回值，对原数组没有影响，不支持IE

* map循环 = 遍历数组中的每一项，不会改变元素组，并且支持return返回

* for of遍历 = 可以正确响应break、continue和return

* filter = 不会改变原始数组，返回新数组

* every = 对数组中的每一项给定运行函数，如果该函数的每一项返回true，则返回true

* some = 对数组中每一项运行指定函数，如果该函数对任一项返回true，则返回true

* reduce = 接收一个函数作为累加器（accumulator），数组中的每个值（从左到右）开始缩减，最终为一个值

* reduceRight = 和reduce()功能是一样的，不同的是reduceRight()从数组的末尾向前将数组中的数组项做累加。

* find = 遍历去满足某一个条件，返回满足条件的第一个元素，否则返回undefined

* findIndex = 遍历去满足某一个条件，返回满足条件的第一个元素索引，都不满足则返回-1

* for of + keys() = 用for...of循环进行遍历，唯一的区别是keys()是对键名的遍历

* for of + values() = 用for...of循环进行遍历，唯一的区别是values()是对键名的遍历

* for of + entries() = 用for...of循环进行遍历，唯一的区别是entries()是对键名的遍历

loopArray() {

let arr = [1, 2, 3];

for (let i = 0; i < arr.length; i++){

console.log(arr[i]);

}

// 遍历数组中的每一项，没有返回值，对原数组没有影响，不支持IE

arr.forEach((item, index, array) => {

item += 1;

});

console.log(arr);

// 遍历数组中的每一项，不会改变元素组，并且支持return返回

arr.map((item, index, array) => {

item += 1;

return true;

});

console.log(arr);

// 可以正确响应break、continue和return

for (let value of arr) {

if (value === 2) {

continue;

}

value += 1;

console.log(value);

}

/**

* 课外知识：在for循环中baibreak与continue的区别如下：

break用于完du全结束一个循环，跳出循环体执行循环后面的语句；

而continue是跳dao过当次循环中剩下的语句，执行下一次循环。

简单点说就是break完全结束循环，continue终止本次循环。

// 不会改变原始数组，返回新数组

let newArr = arr.filter(item => item > 2);

console.log(arr, newArr);

let myArr = [

{

id: 1, text:'aa', done: true

{

id: 2, text:'bb', done: false

}

];

let lastArr = myArr.filter(item => item.done);

console.log(lastArr);

// es5

myArr.filter(item => {

return item.done;

});

// 对数组中的每一项给定运行函数，如果该函数的每一项返回true，则返回true

let everyArr = arr.every((item, index, array) => {

return item > 0;

});

console.log(everyArr);

let someArr = arr.some((item, index, array) => {

return item > 2;

});

console.log(someArr);

// 接收一个函数作为累加器（accumulator），数组中的每个值（从左到右）开始缩减，最终为一个值

// reduce接受一个函数，函数有四个参数，分别是：上一次的值，当前值，当前值的索引，数组

// 循环回调过程

// 0 1

// 1 2

// 3,3

// 6

let total = arr.reduce((a, b) => a + b);

console.log(total);

arr.reduce((previousValue, currentValue, index, array) => {

return previousValue + currentValue;

});

// reduce还有第二个参数，我们可以把这个参数作为第一次调用callback时的第一个参数.

// 上面这个例子因为没有第二个参数，所以直接从数组的第二项开始

// 循环回调过程

// 10 1

// 11 2

// 13,3

// 16

arr.reduce((previousValue, currentValue, index, array) => {

return previousValue + currentValue;

}, 10);

// reduceRight()方法的功能和reduce()功能是一样的，不同的是reduceRight()从数组的末尾向前将数组中的数组项做累加。

// reduceRight()首次调用回调函数callbackfn时，prevValue 和 curValue 可以是两个值之一。

// 如果调用 reduceRight() 时提供了 initialValue 参数，则 prevValue 等于 initialValue，curValue 等于数组中的最后一个值

// 如果没有提供 initialValue 参数，则 prevValue 等于数组最后一个值， curValue 等于数组中倒数第二个值。

// 循环回调过程

// 3 2

// 5 1

// 6

arr.reduceRight((preValue, curValue, index, array) => {

return preValue + curValue;

});

// 如果提供一个初始值initialValue为5:

// 10 3

// 13 2

// 15 1

// 6

arr.reduceRight((preValue, curValue, index, array) => {

return preValue + curValue;

}, 10);

// 返回数组中符合测试函数条件的第一个元素。否则返回undefined

myArr.find(this.getStu);

// 对于数组中的每个元素，findIndex 方法都会调用一次回调函数（采用升序索引顺序），直到有元素返回 true。

// 只要有一个元素返回 true，findIndex 立即返回该返回 true 的元素的索引值

// 如果数组中没有任何元素返回 true，则 findIndex 返回 -1。

//findIndex 不会改变数组对象。

let findIndexValue = arr.findIndex((item) => item === 2);

console.log(findIndexValue);

// ES6 提供三个新的方法 —— entries()，keys()和values() —— 用于遍历数组。

// 它们都返回一个遍历器对象，可以用for...of循环进行遍历，

// 唯一的区别是keys()是对键名的遍历、

let littleArr = ['a', 'b'];

for(let index of littleArr.keys()) {

console.log(index);

}

// values()是对键值的遍历，

for (let elem of littleArr.values()) {

console.log(elem);

}

// entries()是对键值对的遍历

for (let [index, item] of littleArr.entries()) {

console.log(index, item);

}

/**

* find方法条件

* @param element

* @returns {*}

getStu(element) {

return element.text;

}

```

在for循环中break与continue的区别如下：

break用于完du全结束一个循环，跳出循环体执行循环后面的语句；

而continue是跳dao过当次循环中剩下的语句，执行下一次循环。

###### 简单点说就是break完全结束循环，continue终止本次循环。

## 数组的常用方法整理

1.　Array.push()，向数组的末尾添加一个或多个元素，并返回新的数组长度。原数组改变。

2.　Array.pop()，删除并返回数组的最后一个元素，若该数组为空，则返回undefined。原数组改变。

3.　Array.unshift()，向数组的开头添加一个或多个元素，并返回新的数组长度。原数组改变。

4.　Array.shift()，删除数组的第一项，并返回第一个元素的值。若该数组为空，则返回undefined。原数组改变。

5.　Array.concat(arr1,arr2...)，合并两个或多个数组，生成一个新的数组。原数组不变。

6.　Array.join()，将数组的每一项用指定字符连接形成一个字符串。默认连接字符为 “,” 逗号。

7.　Array.reverse()，将数组倒序。原数组改变。

8.　Array.sort()，对数组元素进行排序。按照字符串UniCode码排序，原数组改变。

9.　Array.map(function)，原数组的每一项执行函数后，返回一个新的数组。原数组不变。（注意该方法和forEach的区别）。

10.　Array.slice(start,end)，从start开始，end之前结束，不到end；如果不给end值，从start开始到数组结束。start可以给负值，-1表示数组最后位置，-2表示倒数第二个，以此类推，顾前不顾后。

11.　Array.splice(index,howmany,arr1,arr2...) ，删除元素并添加元素，从index位置开始删除howmany个元素，并将arr1、arr2...数据从index位置依次插入。howmany为0时，则不删除元素。原数组改变。

12.　Array.forEach(function)，用于调用数组的每个元素，并将元素传递给回调函数。原数组不变。（注意该方法和map的区别，若直接打印Array.forEach，结果为undefined）。

13.　Array.filter(function)，过滤数组中，符合条件的元素并返回一个新的数组。

14.　Array.every(function)，对数组中的每一项进行判断，若都符合则返回true，否则返回false。

15.　Array.some(function)，对数组中的每一项进行判断，若都不符合则返回false，否则返回true。

16.　Array.reduce(function)，reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。

```

/**

* 几个比较常用的方法

* push 进栈，改变原数组

* pop 出栈，改变原数组

* shift 插入第一个元素，改变原数组

* unshift 删除第一个元素，改变原数组

* split 分割,join 合并

* reverse 倒序，改变原数组

* concat 合并，不改变原数组

* sort 排序，改变原数组

* splice 删除和插入，改变原数组

* slice 截取，不改变原数组

* indexOf lastIndexOf 查找满足条件的索引

* includes === some 是否满足条件，返回true/false

* Array.isArray([]) 是否是数组

pacific() {

let arr = [1, 2, 3, 4, 5];

console.log(arr);

// 向数组的末尾添加一个或多个元素，并返回新的数组长度。

// 原数组改变。

arr.push(10, 11, 12);

console.log(arr);

// 删除并返回数组的最后一个元素，若该数组为空，则返回undefined。

// 原数组改变。

arr.pop();

console.log(arr);

// 向数组的开头添加一个或多个元素，并返回新的数组长度。

// 原数组改变。

arr.unshift('a');

console.log(arr);

// 删除数组的第一项，并返回第一个元素的值。若该数组为空，则返回undefined。

// 原数组改变。

arr.shift();

console.log(arr);

// 合并两个或多个数组，生成一个新的数组。

// 原数组不变。

let arr2 = ['a', 'b'];

let arr3 = arr.concat(arr2);

console.log(arr3);

// 将数组的每一项用指定字符连接形成一个字符串。默认连接字符为 “,” 逗号。

// toString 也可以将其转换成字符串arr.toString(',')

let arrToString = arr.join(',');

console.log(arrToString);

arr = arrToString.split(',');

// 将数组倒序。返回新数组，原数组也会改变;

// 原数组改变。

arr.reverse();

console.log(arr);

// sort 从小到大

// 原素组改变

let ascSort = (a, b) => {

return a - b;

};

arr.sort(ascSort);

console.log(arr);

// sort 从大到小

// 原素组改变

arr.sort((a, b) => {

return b - a;

});

console.log(arr);

// 在数组中添加删除或替换元素

// 有三个或者多个值时，第一个值为插入元素的位置，第二个值为替换的个数，后面的值都为插入的新元素；

// 改变原数组的值

arr.splice(0, 2, 'a', 'b');

console.log(arr);

// 截取复制数组指定位置的内容

// slice(开始位置，结束位置)

// slice()或者slice(0)都可以复制数组；

// slice()方法不会更改到原数组的值

// 不改变元素组

let arr4 = arr.slice(1, 3);

console.log(arr4);

// indexOf(某元素,startIndex) 从startIndex开始，查找某元素在数组中的位置。

// 若存在，则返回第一个位置的下标,否则返回-1

// lastIndexOf(某元素，startIndex) 和indexOf()相同，区别在于从尾部向首部查询

// 不会改变原数组

let index = arr.indexOf('3', 0);

console.log(index);

// includes()

// 返回一个布尔值。参数是一个value,一般用于简单数组。

// 对于复杂数组，则可以使用some()方法替代includes()方法

console.log(arr.includes('2'));

// isArray

// 用来判断一个元素是否为数组

console.log(Array.isArray(arr));

}

```

原文链接：https://www.cnblogs.com/xiangW/p/11064574.html