js 数组方法

1.concat
说明：用于合并两个或多个数组。此方法不会更改现有数组，返回值是一个新数组。

var array1 = ['a', 'b', 'c'];
var array2 = ['d', 'e', 'f'];

console.log(array1.concat(array2));
//  ["a", "b", "c", "d", "e", "f"]

语法：var new_array = old_array.concat(value1[, value2[, …[, valueN]]]);
参数：valueN（可选）
返回值：新的Array实例。
concat方法不会改变this或任何作为参数提供的数组，而是返回一个浅拷贝，它包含与原始数组相结合的相同元素的副本。原始数组的元素将复制到新数组中。

①.数据类型如字符串，数字和布尔（不是String，Number 和 Boolean 对象）：concat将字符串和数字的值复制到新数组中。

var array1 = [1, 2, 3];
var array2 = array1.concat(); // [1, 2, 3]
// 无参数时
// 可以利用该方法进行拷贝数组（前提是数组里不包含对象）

②. 对象引用（而不是实际对象）：concat将对象引用复制到新数组中。原始数组和新数组都引用相同的对象。也就是说，如果引用的对象被修改，则更改对于新数组和原始数组都是可见的。这包括也是数组的数组参数的元素。

var array1 = [1, 2, 3];
var array2 = [{name: 'zxx'}];
var array3 = array1.concat(array2);
array3[3].age = 18;
console.log(array3); // [1, 2, 3 , {name: 'zxx', age: 18}]
console.log(array2); // [{name: 'zxx', age: 18}]

2.join
说明：将一个数组（或一个类数组对象）的所有元素连接成一个字符串并返回这个字符串。如果数组只有一个项目，那么将返回该项目而不使用分隔符。

var elements = ['Fire', 'Wind', 'Rain'];
console.log(elements.join());
// expected output: "Fire,Wind,Rain"
console.log(elements.join(''));
// expected output: "FireWindRain"
console.log(elements.join('-'));
// expected output: "Fire-Wind-Rain"

语法： arr.join([separator])
参数： separator(可选)。指定一个字符串来分隔数组的每个元素。如果需要，将分隔符转换为字符串。如果省略，数组元素用逗号分隔。如果separator是空字符串("")，则所有元素之间都没有任何字符。
返回值：一个所有数组元素连接的字符串。如果 arr.length 为0，则返回空字符串。

3.pop
说明：从数组中删除最后一个元素，并返回该元素的值。此方法更改数组的长度。
语法： arr.pop()；
返回值：从数组中删除的元素(当数组为空时返回undefined)
pop方法根据 length属性来确定最后一个元素的位置。如果不包含length属性或length属性不能被转成一个数值，会将length置为0，并返回undefined。

如果你在一个空数组上调用 pop()，它返回 undefined。

var myFish = ["angel", "clown", "mandarin", "surgeon"];
var popped = myFish.pop();
console.log(myFish); 
// ["angel", "clown", "mandarin"]
console.log(popped); 
// surgeon

4.push
说明：将一个或多个元素添加到数组的末尾，并返回该数组的新长度。
语法： arr.push(element1, …, elementN)；
参数： elementN 被添加到数组末尾的元素；
返回值: 当调用该方法时，新的 length 属性值将被返回。
push 方法根据 length 属性来决定从哪里开始插入给定的值。如果 length 不能被转成一个数值，则插入的元素索引为 0，包括 length 不存在时。当 length 不存在时，将会创建它。
①.添加元素到数组：

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

②. 合并两个数组：
注意当第二个数组(如示例中的moreVegs)太大时不要使用这个方法来合并数组，因为事实上一个函数能够接受的参数个数是有限制的。

var arr1 = ['parsnip', 'potato'];
var arr2 = ['celery', 'beetroot'];

// 将第二个数组融合进第一个数组
// 相当于 arr1.push('celery', 'beetroot');
Array.prototype.push.apply(arr1, arr2);

console.log(arr1); 
// ['parsnip', 'potato', 'celery', 'beetroot']

③.像数组一样使用对象：
Array.prototype.push 可以在一个对象上工作。注意，我们没有创建一个数组来存储对象的集合。相反，我们将该集合存储在对象本身上，并使用在 Array.prototype.push 上使用的 call 来调用该方法，使其认为我们正在处理数组，而它只是像平常一样运作，这要感谢 JavaScript 允许我们建立任意的执行上下文。

var obj = {
    length: 0,
    addElem: function addElem (elem) {
        [].push.call(this, elem);
    }
};
obj.addElem({});
obj.addElem({});
console.log(obj.length);
//  2

注意，尽管 obj 不是数组，但是 push 方法成功地使 obj 的 length 属性增长了，就像我们处理一个实际的数组一样。

5.shift
说明：从数组中删除第一个元素，并返回该元素的值。此方法更改数组的长度。
语法： arr.shift()
返回值：从数组中删除的元素; 如果数组为空则返回undefined 。
shift 方法移除索引为 0 的元素(即第一个元素)，并返回被移除的元素，其他元素的索引值随之减 1。如果 length 属性的值为 0 (长度为 0)，则返回 undefined。

shift 方法并不局限于数组：这个方法能够通过 call 或 apply 方法作用于类似数组的对象上。但是对于没有 length 属性（从0开始的一系列连续的数字属性的最后一个）的对象，调用该方法可能没有任何意义。

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"

unshift
说明：将一个或多个元素添加到数组的开头，并返回该数组的新长度。
语法： arr.unshift(element1, …, elementN)
参数： elementN 要添加到数组开头的元素；
返回值：当一个对象调用该方法时，返回其length属性值；

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
//此时数组为 [-2, -1, 0, 1, 2]
arr.unshift( [-3] );
//此时数组为 [[-3], -2, -1, 0, 1, 2]

slice
说明：返回一个新的数组对象，这一对象是一个由 begin和 end（不包括end）决定的原数组的浅拷贝。原始数组不会被改变。
语法： arr.slice(begin, end);
参数说明： begin（可选）从该索引处开始提取原数组中的元素（从0开始）。
如果该参数为负数，则表示从原数组中的倒数第几个元素开始提取，slice(-2)表示提取原数组中的倒数第二个元素到最后一个元素（包含最后一个元素）。
如果省略 begin，则 slice 从索引 0 开始。

end（可选）在该索引处结束提取原数组元素（从0开始）。slice会提取原数组中索引从 begin 到 end 的所有元素（包含begin，但不包含end）。
slice(1,4) 提取原数组中的第二个元素开始直到第四个元素的所有元素（索引为 1, 2, 3的元素）。
如果该参数为负数，则它表示在原数组中的倒数第几个元素结束抽取。 slice(-2,-1)表示抽取了原数组中的倒数第二个元素到最后一个元素（不包含最后一个元素，也就是只有倒数第二个元素）。
如果 end 被省略，则slice 会一直提取到原数组末尾。
如果 end 大于数组长度，slice 也会一直提取到原数组末尾。
返回值：一个截取之后的新数组
①. 返回现有数组的一部分：

var arr1 = [1, 2, 3, 4, 5];
var arr2 = arr1.slice(); // 可实现数组的浅拷贝；
var arr3 = arr1.slice(0,2); // [1, 2]

②. 将类数组对象转换成一个新数组：

function list() {
  return Array.prototype.slice.call(arguments);
}

var list1 = list(1, 2, 3); // [1, 2, 3]

也可以利用bind

var unboundSlice = Array.prototype.slice;
var slice = Function.prototype.call.bind(unboundSlice);

function list() {
  return slice(arguments);
}

var list1 = list(1, 2, 3); // [1, 2, 3]

参考资料： MDN

猜你喜欢