JS数组方法合集

目录

1、创建一个数组

1.字面量 

2.通过构造函数 

3.ES6 Array.of() 

4.ES6 Arrary.from() 

 2、改变原数组的方法

1.Array.prototype.splice()

2.Array.prototype.sort()

3.Array.prototype.shift() 

4.Array.prototype.push()

5.Array.prototype.unshift() 

6、Array.prototype.pop() 

7、Array.prototype.reverse() 

8、Array.prototype.fill()

3、不改变原数组的方法 

1.Array.prototype.slice() 

2.Array.prototype.join()

3.Array.prototype.toStrigin()

4、Array.prototype.concat()

5、Array.prototype.indexOf() 

6.Array.prototype.lastIndexOf() 

7、Array.prototype.includes() 

---

#博学谷IT学习技术支持#

1、创建一个数组

1.字面量 

let arr = [];
let arr1 = [1, 2, 3];
console.log(arr1);   //[ 1, 2, 3 ]

2.通过构造函数 

//通过构造函数
let arr2 = new Array(1, 2, 3);
console.log(arr2);  //[ 1, 2, 3 ]

3.ES6 Array.of() 

返回由所有参数值组成的数组，如果没有参数，就返回一个空数组。

//ES6 Array.of() 
let a = Array.of();
console.log(a);  //[]
let b = Array.of(1, 2, 3);
console.log(b);  //[ 1, 2, 3 ]

4.ES6 Arrary.from() 

用于将两类对象转为真正的数组（不改变原对象，返回新的数组） 

// 1.对象拥有length属性
let obj = { 0: 'a', 1: 'b', 2: 'c', length: 3 };
let arr3 = Array.from(obj); 
console.log(arr3);  //[ 'a', 'b', 'c' ]
// 2.字符串 生出数组
let arr4 = Array.from('hello'); 
console.log(arr4);  //[ 'h', 'e', 'l', 'l', 'o' ]
// 3.Set 生出数组
let arr5 = Array.from(new Set(['a', 'b', 'b'])); 
console.log(arr5);  //[ 'a', 'b' ]   可用于数组去重

 2、改变原数组的方法

ES5:splice()/ sort() / pop()/ shift()/ push()/ unshift()/ reverse()

ES6:fill 

1.Array.prototype.splice()

splice() 方法通过删除或替换现有元素或者原地添加新的元素来修改数组，并以数组形式返回被

修改的内容。此方法会改变原数组。

语法：

array.splice(start[, deleteCount[, item1[, item2[, ...]]]])

参数：

start：  指定修改的开始位置（从 0 计数）。如果超出了数组的长度，则从数组末尾开始添加内

容；如果是负值，则表示从数组末位开始的第几位，如果负数的绝对值大于数组的长度，则表示开

始位置为第 0 位。

deleteCount：  整数，表示要移除的数组元素的个数。

item1, item2, ...   ： 要添加进数组的元素，从start 位置开始。如果不指定，则 splice() 将只删

除数组元素。

示例：

let arr = [1, 'a', 'b', 2];
let arr1 = [1, 2, 3];
let a = arr.splice(0, 1)
console.log(a);  //[ 1 ]
console.log(arr);  //[ 'a', 'b', 2 ]
arr1.splice(1, 0, 4)
console.log(arr1);  //[ 1, 4, 2, 3 ]

2.Array.prototype.sort()

sort() 方法用原地算法对数组的元素进行排序，并返回数组 

语法：

arr.sort([compareFunction])

参数：

compareFunction ： 用来指定按某种顺序进行排列的函数。 

示例：

let arr = [2, 32, 4, 42, 42, 64, 12, 6];
let arr1 = [2, 32, 4, 42, 42, 64, 12, 6];
let a = arr.sort((a, b) => a - b)
let b = arr1.sort((a, b) => b - a)
console.log(a);  // [2,  4,  6, 12,32, 42, 42, 64]  升序
console.log(b);  //[64, 42, 42, 32,12, 6, 4, 2]    降序

3.Array.prototype.shift() 

shift() 方法从数组中删除第一个元素，并返回该元素的值。此方法更改数组的长度。 

语法：

arr.shift() 

示例：

let arr = [1, 2, 3]
let a= arr.shift();
console.log(arr);  //[ 2, 3 ]
console.log(a);   //1

 4.Array.prototype.push()

push() 方法将一个或多个元素添加到数组的末尾，并返回该数组的新长度。 

语法：

arr.push(element1, ..., elementN)

示例：

let arr = [1, 23, 4];
let a = arr.push('a');
console.log(arr);  //[ 1, 23, 4, 'a' ]
console.log(a);   //4   数组长度

 5.Array.prototype.unshift() 

unshift() 方法将一个或多个元素添加到数组的开头，并返回该数组的新长度（该方法修改原有数

组）。 

语法：

arr.unshift(element1, ..., elementN)

示例：

let arr = [1, 2, 3];
let a = arr.unshift('a', 'b')
console.log(arr);  //[ 'a', 'b', 1, 2, 3 ]
console.log(a);   //5 

6、Array.prototype.pop() 

pop() 方法从数组中删除最后一个元素，并返回该元素的值。此方法会更改数组的长度。 

 示例：

let arr = [1, 23, 4]
let a = arr.pop()
console.log(arr); //[ 1, 23 ]
console.log(a);  //4

7、Array.prototype.reverse() 

reverse() 方法将数组中元素的位置颠倒，并返回该数组。

示例：

let arr = [1, 3, 'a', 6];
let a = arr.reverse();
console.log(arr);   //[ 6, 'a', 3, 1 ]
console.log(a);     //[ 6, 'a', 3, 1 ]

 8、Array.prototype.fill()

fill() 方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索

引。 

语法：

arr.fill(value[, start[, end]])

value： 用来填充数组元素的值。

start ：起始索引，默认值为 0。 

end ： 终止索引，默认值为this.length。 

示例：

let arr = [1, 2, 3, 4]
arr.fill(1, 1)
console.log(arr);   //[ 1, 1, 1, 1 ]

3、不改变原数组的方法 

ES5： slice、join、toStrigin、cancat、indexOf、lastIndexOf、

ES7： includes 

1.Array.prototype.slice() 

slice() 方法返回一个新的数组对象，这一对象是一个由 begin 和 end 决定的原数组的浅拷贝（包

括 begin，不包括end）。原始数组不会被改变。 

语法：

arr.slice([begin[, end]])

参数：

begin： 提取起始处的索引（从 0 开始），从该索引开始提取原数组元素 

end ; 提取终止处的索引（从 0 开始），在该索引处结束提取原数组元素。 

示例：

let arr = ['a', 'b', 1, 3, 5, 7]
let newArr = arr.slice(2)
console.log(arr);  //[ 'a', 'b', 1, 3, 5, 7 ]
console.log(newArr);   //[ 1, 3, 5, 7 ]

 2.Array.prototype.join()

 join() 方法将一个数组（或一个类数组对象）的所有元素连接成一个字符串并返回这个字符串。

如果数组只有一个项目，那么将返回该项目而不使用分隔符。

示例：

const elements = ['Fire', 'Air', 'Water'];

console.log(elements.join());   //Fire,Air,Water
console.log(elements.join(''));  //FireAirWater
console.log(elements.join('-'));  //Fire-Air-Water

 3.Array.prototype.toStrigin()

toString() 返回一个字符串，表示指定的数组及其元素。

示例：

const array1 = [1, 2, 'a', '1a'];
console.log(array1.toString());   //1,2,a,1a

4、Array.prototype.concat()

concat() 方法用于合并两个或多个数组。此方法不会更改现有数组，而是返回一个新数组。

语法： 

var new_array = old_array.concat(value1[, value2[, ...[, valueN]]])

 参数：

valueN ： 数组和/或值，将被合并到一个新的数组中。

示例：

const array1 = ['a', 'b', 'c'];
const array2 = ['d', 'e', 'f'];
const array3 = array1.concat(array2);

console.log(array3);   //[ 'a', 'b', 'c', 'd', 'e', 'f' ]

5、Array.prototype.indexOf() 

indexOf()方法返回在数组中可以找到一个给定元素的第一个索引，如果不存在，则返回-1。 

语法;

arr.indexOf(searchElement[, fromIndex])

searchElement: 要查找的元素 

fromIndex  : 开始查找的位置。 

示例:

let arr = [1, 2, 3, 'a', 'b']
let index = arr.indexOf('a')
console.log(index);   //3

6.Array.prototype.lastIndexOf() 

lastIndexOf() 方法返回指定元素（也即有效的 JavaScript 值或变量）在数组中的最后一个的索

引，如果不存在则返回 -1。从数组的后面向前查找，从 fromIndex 处开始。

示例：

let arr = [1, 3, 5, 'a', 1, 2]
let index = arr.lastIndexOf(1)
console.log(index);   //4

7、Array.prototype.includes() 

includes() 方法用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回 true，否

则返回 false。 

语法:

arr.includes(valueToFind[, fromIndex])

 参数：

valueToFind ： 需要查找的元素值。

fromIndex ： 从fromIndex 索引处开始查找 valueToFind。 

示例：

const array1 = [1, 2, 3];

console.log(array1.includes(2));  //true

const pets = ['cat', 'dog', 'bat'];

console.log(pets.includes('cat'));  //true

console.log(pets.includes('at'));  //false