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"
  1. 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]
  1. 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

你可能感兴趣的:(js基础)