JavaScript Array对象方法归类 —— 改变原数组的方法

注:处于 experimental 阶段的方法未收录

Array对象改变原数组的方法一览

释义:某个数组对象通过调用该类方法会导致自身内容发生修改。

方法 描述
copyWithin() 从数组的指定位置拷贝元素到数组的另一个指定位置中。
fill() 用一个固定值替换数组的元素。
pop() 删除数组的最后一个元素并返回删除的元素。
push() 向数组的末尾添加一个或多个元素,并返回新的长度。
reverse() 颠倒数组中元素的顺序。
shift() 把数组的第一个元素从其中删除,并返回第一个元素的值。
sort() 对数组的元素进行排序。
splice() 添加或删除数组中的元素。
unshift() 向数组的开头添加一个或更多元素,并返回新的长度。

Array对象改变原数组的方法用法

copyWithin()

方法 浅拷贝 数组的一部分到同一数组中的另一个位置,并返回它,不会改变原数组的长度。

浅拷贝 :浅拷贝只复制指向某个对象的指针,而不复制对象本身,新旧对象还是共享同一块存储空间。
深拷贝 :深拷贝会另外创造一个一模一样的对象,新对象跟原对象不用同一块存储空间,修改新对象不会改到原对象。请添加图片描述

语法

copyWithin(target)
copyWithin(target, start)
copyWithin(target, start, end)

参数

名称 类型 描述
target 整数 必需,索引从 0 开始,复制序列到该位置。如果是负数,target 将从末尾开始计算。如果 target 大于等于 arr.length,将不会发生拷贝。如果 target 在 start 之后,复制的序列将被修改以符合 arr.length。
start 整数 可选,索引从 0 开始,开始复制元素的起始位置。如果是负数,start 将从末尾开始计算。如果 start 被忽略,copyWithin 将会从 0 开始复制。
end 整数 可选,索引从 0 开始,开始复制元素的结束位置。copyWithin 将会拷贝到该位置,但不包括 end 这个位置的元素。如果是负数, end 将从末尾开始计算。如果 end 被忽略,copyWithin 方法将会一直复制至数组结尾(默认为 arr.length)。

返回值

改变后的数组。

示例

[1, 2, 3, 4, 5, 6, 7, 8].copyWithin(2);
// [1, 2, 1, 2, 3, 4, 5, 6]
[1, 2, 3, 4, 5, 6, 7, 8].copyWithin(1,3);
// [1, 4, 5, 6, 7, 8, 7, 8]
[1, 2, 3, 4, 5, 6, 7, 8].copyWithin(0,3,4);
// [4, 2, 3, 4, 5, 6, 7, 8]

fill()

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

语法

fill(value)
fill(value, start)
fill(value, start, end)

参数

名称 类型 描述
value 任意类型 必需 ,用来填充数组元素的值,需要注意如果 fill 的参数为引用类型,会导致都执行同一个引用类型。
start 整数 必需 ,起始索引,默认值为 0。如果为负值,表示从末尾开始计算。
end 整数 必需 ,终止索引,默认值为 this.length。如果为负值,表示从末尾开始计算。

返回值

修改后的数组。

示例

[1, 2, 3, 4, 5, 6, 7, 8].fill(2);
// [2, 2, 2, 2, 2, 2, 2, 2]
[1, 2, 3, 4, 5, 6, 7, 8].fill(2,3);
// [1, 2, 3, 2, 2, 2, 2, 2]
[1, 2, 3, 4, 5, 6, 7, 8].fill(2,3,5);
// [1, 2, 3, 2, 2, 6, 7, 8]

const arr = Array(3).fill({
    
    a:1}); // arr:[{}, {}, {}]
arr[0].a = "b"; // arr:[{a:"b"}, {a:"b"}, {a:"b"}]

pop()

方法从数组中删除最后一个元素,并返回该元素的值。

语法

arr.pop()

参数

名称 类型 描述

返回值

从数组中删除的元素;如果数组为空返回undefined。

示例

const arr = [1, 2, 3, 4, 5, 6, 7, 8];
arr.pop(); // 8
// arr:[1, 2, 3, 4, 5, 6, 7]

push()

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

语法

arr.push(element1, …, elementN)

参数

名称 类型 描述
elementN 任意类型 可选 ,被添加到数组末尾的元素。

返回值

新的 length 属性值。

示例

const arr = [1, 2, 3, 4, 5, 6, 7, 8];
arr.push(); // 8
// arr:[1, 2, 3, 4, 5, 6, 7, 8]
arr.push(9); // 9
// arr:[1, 2, 3, 4, 5, 6, 7, 8, 9]
arr.push(10, 11); // 11
// arr:[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]

reverse()

方法将数组中元素的位置颠倒,并返回该数组。数组的第一个元素会变成最后一个,数组的最后一个元素变成第一个。

语法

arr.reverse()

参数

名称 类型 描述

返回值

颠倒后的数组。

示例

const arr = [1, 2, 3, 4, 5, 6, 7, 8];
arr.reverse();
// arr:[8, 7, 6, 5, 4, 3, 2, 1]

shift()

方法从数组中删除第一个元素,并返回该元素的值。

语法

arr.shift()

参数

名称 类型 描述

返回值

从数组中删除的元素;如果数组为空则返回undefined 。

示例

const arr = [1, 2, 3, 4, 5, 6, 7, 8];
arr.shift(); // 1
// arr:[2, 3, 4, 5, 6, 7, 8]

sort()

方法会原地(in place)对一个数组的所有元素进行排序,并回传此数组。排序不一定是稳定的(stable)。预设的排序顺序是根据字串的Unicode编码位置(code points)而定。由于依赖执行环境的实作,所以并不能保证排序的时间及空间复杂度。

语法

arr.sort([compareFunction])

参数

名称 类型 描述
compareFunction 函数 可选 ,用来指定按某种顺序进行排列的函数。如果省略,元素按照转换为的字符串的各个字符的 Unicode 位点进行排序。

说明:

如果没有指明 compareFunction ,那么元素会按照转换为的字符串的诸个字符的 Unicode 位点进行排序。例如 “Banana” 会被排列到 “cherry” 之前。当数字按由小到大排序时,9 出现在 80 之前,因为指明 compareFunction,比较的数字会先被转换为字符串,所以在 Unicode 顺序上 “80” 要比 “9” 要靠前。
如果指明了 compareFunction ,那么数组会按照调用该函数的返回值排序。即 a 和 b 是两个将要被比较的元素:

  • 如果 compareFunction(a, b) 小于 0 ,那么 a 会被排列到 b 之前;
  • 如果 compareFunction(a, b) 等于 0 , a 和 b 的相对位置不变。备注: ECMAScript 标准并不保证这一行为,而且也不是所有浏览器都会遵守(例如 Mozilla 在 2003 年之前的版本)
  • 如果 compareFunction(a, b) 大于 0 , b 会被排列到 a 之前。
  • compareFunction(a, b) 必须总是对相同的输入返回相同的比较结果,否则排序的结果将是不确定的。

返回值

排序后的数组。

示例

const arr = [1, 3, 5, 2, 4, 8, 7, 6];
arr.sort(); // [1, 2, 3, 4, 5, 6, 7, 8]
// arr:[1, 2, 3, 4, 5, 6, 7, 8]

const arr1 = [1, 3, 2, "a", "b", "A", "B"];
arr1.sort(); // [1, 2, 3, 'A', 'B', 'a', 'b']
// arr1:[1, 2, 3, 'A', 'B', 'a', 'b']

const arr2 = [1, 3, 5, 2, 4, 8, 7, 6];
arr2.sort(function(a, b) {
    
    
  return b - a;
}); // [8, 7, 6, 5, 4, 3, 2, 1]
// arr2:[8, 7, 6, 5, 4, 3, 2, 1]

splice()

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

语法

splice(start)
splice(start, deleteCount)
splice(start, deleteCount, item1)
splice(start, deleteCount, item1, item2, …, itemN)

参数

名称 类型 描述
start 整数 必需 ,指定修改的开始位置(从 0 计数)。如果超出了数组的长度,则从数组末尾开始添加内容;如果是负值,则表示从数组末位开始的第几位(从 -1 计数,这意味着 -n 是倒数第 n 个元素并且等价于 array.length-n);如果负数的绝对值大于数组的长度,则表示开始位置为第 0 位。
deleteCount 整数 可选 ,要移除的数组元素的个数。如果 deleteCount 被省略了,或者它的值大于等于array.length - start(也就是说,如果它大于或者等于start之后的所有元素的数量),那么start之后数组的所有元素都会被删除。如果 deleteCount 是 0 或者负数,则不移除元素。这种情况下,至少应添加一个新元素。
item1, item2, … 任意类型 可选 ,从start 位置开始,要添加进数组的元素。如果不指定,则 splice() 将只删除数组元素。

返回值

返回由被删除的元素组成的一个数组。如果只删除了一个元素,则返回只包含一个元素的数组。如果没有删除元素,则返回空数组。

示例

const arr = [1, 2, 3, 4, 5, 6, 7, 8];
arr.splice(3); // [4, 5, 6, 7, 8]
// arr:[1, 2, 3]

const arr1 = [1, 2, 3, 4, 5, 6, 7, 8];
arr1.splice(3, 2); // [4, 5]
// arr1:[1, 2, 3, 6, 7, 8]

const arr2 = [1, 2, 3, 4, 5, 6, 7, 8];
arr2.splice(3, 2, "true", "false"); // [4, 5]
// arr2:[1, 2, 3, 'true', 'false', 6, 7, 8]

unshift()

方法将一个或多个元素添加到数组的开头,并返回该数组的新长度。

语法

arr.unshift(element1, …, elementN)

参数

名称 类型 描述
elementN 任意类型 可选 ,要添加到数组开头的元素或多个元素。

返回值

新的 length 属性值。

示例

const arr = [1, 2, 3, 4, 5, 6, 7, 8];
arr.unshift("true", "false"); // 10
// arr:['true', 'false', 1, 2, 3, 4, 5, 6, 7, 8]

参考:
1.《Array - JavaScript | MDN》;
2.《JavaScript Array 对象 | 菜鸟教程》;
3.《JavaScript 数组》-- W3School;

猜你喜欢

转载自blog.csdn.net/Mr_Bobcp/article/details/125663063