JS是否改变原数组的常用方法归纳

发表于   |   分类于   |  

改变原数组的:

1. pop() : 删除一个数组中的最后的一个元素，并且返回这个元素。

1
2
3
4
5
6
7
8
var myFish = ["angel", "clown", "mandarin", "surgeon"];
console.log(myFish); // ["angel", "clown", "mandarin", "surgeon"];
var popped = myFish.pop();
console.log(myFish);  // ["angel", "clown", "mandarin"]
console.log(popped); // ["surgeon"];

2. push() : 添加一个或多个元素到数组的末尾，并返回数组新的长度（length 属性值）。

1
2
3
4
5
var sports = ["soccer", "baseball"];
var total = sports.push("football", "swimming");
console.log(sports); // ["soccer", "baseball", "football", "swimming"]
console.log(total);  // 4

3. shift() : 删除数组的 第一个 元素，并返回这个元素。该方法会改变数组的长度。

1
2
3
4
5
6
7
8
9
10
11
12
var myFish = ['angel', 'clown', 'mandarin', 'surgeon'];
console.log('调用 shift 之前: ' + myFish);
// "调用 shift 之前: angel,clown,mandarin,surgeon"
var shifted = myFish.shift(); 
console.log('调用 shift 之后: ' + myFish); 
// "调用 shift 之后: clown,mandarin,surgeon" 
console.log('被删除的元素: ' + shifted); 
// "被删除的元素: angel"

4. unshift() : 在数组的开头添加一个或者多个元素，并返回数组新的 length 值。

1
2
3
4
5
6
7
8
9
10
var arr = [1, 2];
arr.unshift(0); //result of call is 3, the new array length
// arr is [0, 1, 2]
arr.unshift(-2, -1); // = 5
// arr is [-2, -1, 0, 1, 2]
arr.unshift( [-3] );
// arr is [[-3], -2, -1, 0, 1, 2]

5. splice() : 用新元素替换旧元素，以此修改数组的内容。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
var myFish = ["angel", "clown", "mandarin", "surgeon"];
//从第 2 位开始删除 0 个元素，插入 "drum"
var removed = myFish.splice(2, 0, "drum");
//运算后的 myFish:["angel", "clown", "drum", "mandarin", "surgeon"]
//被删除元素数组：[]，没有元素被删除
//从第 3 位开始删除 1 个元素
removed = myFish.splice(3, 1);
//运算后的myFish：["angel", "clown", "drum", "surgeon"]
//被删除元素数组：["mandarin"]
//从第 2 位开始删除 1 个元素，然后插入 "trumpet"
removed = myFish.splice(2, 1, "trumpet");
//运算后的myFish: ["angel", "clown", "trumpet", "surgeon"]
//被删除元素数组：["drum"]
//从第 0 位开始删除 2 个元素，然后插入 "parrot", "anemone" 和 "blue"
removed = myFish.splice(0, 2, "parrot", "anemone", "blue");
//运算后的myFish：["parrot", "anemone", "blue", "trumpet", "surgeon"]
//被删除元素的数组：["angel", "clown"]
//从第 3 位开始删除 2 个元素
removed = myFish.splice(3, Number.MAX_VALUE);
//运算后的myFish: ["parrot", "anemone", "blue"]
//被删除元素的数组：["trumpet", "surgeon"]

6. sort() : 对数组的元素做原地的排序，并返回这个数组。 sort 排序可能是不稳定的。默认按照字符串的Unicode码位点（code point）排序。

1
2
3
4
5
6
7
8
9
10
11
12
var fruit = ['cherries', 'apples', 'bananas'];
fruit.sort(); // ['apples', 'bananas', 'cherries']
var scores = [1, 10, 2, 21]; 
scores.sort(); // [1, 10, 2, 21]
// Watch out that 10 comes before 2,
// because '10' comes before '2' in Unicode code point order.
var things = ['word', 'Word', '1 Word', '2 Words'];
things.sort(); // ['1 Word', '2 Words', 'Word', 'word']
// In Unicode, numbers come before upper case letters,
// which come before lower case letters.

7. reverse() : 颠倒数组中元素的位置。第一个元素会成为最后一个，最后一个会成为第一个。

1
2
3
4
var myArray = ['one', 'two', 'three'];
myArray.reverse(); 
console.log(myArray) // ['three', 'two', 'one']

不改变原数组的:

1. slice() : 会浅复制（shallow copy）数组的一部分到一个新的数组，并返回这个新数组。

1
2
3
4
5
// Our good friend the citrus from fruits example
var fruits = ["Banana",  "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1, 3);
//  puts --> ["Orange","Lemon"]

2. join() : 将数组中的所有元素连接成一个字符串。

1
2
3
4
5
var a = ['Wind', 'Rain', 'Fire'];
var myVar1 = a.join();      // myVar1的值变为"Wind,Rain,Fire"
var myVar2 = a.join(', ');  // myVar2的值变为"Wind, Rain, Fire"
var myVar3 = a.join(' + '); // myVar3的值变为"Wind + Rain + Fire"
var myVar4 = a.join('');    // myVar4的值变为"WindRainFire"

3.concat() : 将传入的数组或非数组值与原数组合并,组成一个新的数组并返回.

1
2
3
4
5
var alpha = ["a", "b", "c"];
var numeric = [1, 2, 3];
// 组成新数组 ["a", "b", "c", 1, 2, 3]; 原数组 alpha 和 numeric 未被修改
var alphaNumeric = alpha.concat(numeric);

4.map() : 返回一个由原数组中的每个元素调用一个指定方法后的返回值组成的新数组。

1
2
3
var numbers = [1, 4, 9];
var roots = numbers.map(Math.sqrt);
/* roots的值为[1, 2, 3], numbers的值仍为[1, 4, 9] */

5.filter() : 使用指定的函数测试所有元素，并创建一个包含所有通过测试的元素的新数组。

1
2
3
4
5
function isBigEnough(element) {
  return element >= 10;
}
var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44]