JS数组相关操作

Posted 2023-02-05 若兰明月

数组的添加

var arr = [];
arr[0] = 1;
arr[1] = 2;
arr.push(3)  //  添加到末尾
arr; // [1,2,3]

arr[arr.length] = 4 // 相当于 equal to arr.push(4)
arr;  // [1,2,3,4]

arr.unshift(0)  // 在首位添加一个元素
arr; // [0,1,2,3,4]  

数组的删除

delete arr[2]
arr; // [0,1,undefined,3,4]
arr.length = 5
2 in arr // false

arr.length -= 1  // 也是移除最后一个
arr; // [0,1,undefined,3]

arr.pop() // 3 returned by pop
arr; // [0,1,undefined]  3 is removed

arr.shift() // 0 returned by shift 
arr; // [1,undefined]

数组方法

• Array.prototype.join 数组拼接
• Array.prototype.reverse 数组反转
• Array.prototype.sort 排序

var arr = ['a','d','c','b']
arr.sort(); // ['a','b','c',d]

arr = [13,32,53,2]
arr.sort(); // [13,2.32,53]   原数组被修改  但是按照的是字符串进行的排序

arr.sort(function(a,b)
    return a - b
) // [2,13,32,53]

arr = [age:25,age:59,age:32]
arr.sort(function(a,b)
    return a.age - b.age
)
arr.forEach(function(item)
    console.log('age',item.age)
) // age 25  age 32  age 59

• Array.prototype.concat

var arr = [1,2,3]
arr.contract(4,5) // [1,2,3,4,5]  会返回一个新的数组
arr // [1,2,3]   arr未被修改

arr.contract([10,11],13)  // [1,2,3,10,11,13]

arr.contract(1,[2,3]) // [1,2,3,1,[2,3]]

• Array.prototype.slice // 返回部分数组
• Array.prototype.splice // 数组拼接

var arr = [1,2,3,4,5]
arr.splice(2)  // returns [3,4,5]
arr; // [1,2]  原数组被修改

arr = [1,2,3,4,5]
arr.splice(2,2)  // returns [3,4]
arr[1,2,5]

arr = [1,2,3,4,5]
arr.splice(1,1,'a','b')  // returns [2]
arr;// [1,'a','b',3,4,5]

• Array.prototype.forEach (ES5) 数组遍历 接受一个函数作为参数

var arr = [1,2,3,4,5]
arr.forEach(function(x,index,a)
    console.log(x = '|' + index + '|' + (a === arr)

// 1 | 0 | true
// 2 | 1 | true
// 3 | 2 | true
// 4 | 3 | true
// 5 | 4 | true

• Array.prototype.map (ES5) 数组映射

var arr = [1,2,3]
arr.map(function(x)
    return x + 10
) // [11,12,13]
arr // [1,2,3]  原数组没有被修改

• Array.prototype.fliter (ES5) 数组过滤 原数组没有被修改
• Array.prototype.every (ES5) 数组判断 每一个都符合条件才返回true
• Array.prototype.some (ES5) 数组判断 任意一个符合条件就返回true
• Array.prototype.reduce/reduceRight (ES5) 一个从左开始遍历 一个从右开始遍历

var arr = [1,2,3]
var sum = arr.reduce(function(x,y)
    return x + y
,0)  // 6
arr // [1,2,3]

arr = [3,9,6]
var max = arr.reduce(function(x,y)
    console.log(x +'|' + y)
    return x > y ? x : y
)  
// 3|9
// 9|6
max ;// 9

• Array.prototype.indexOf/lastIndexOf (ES5)
• Array.prototype.isArray (ES5) 判断是否为数组

Array.isArray([])  true

或者以下的方式
[] instanceof Array   // true
().toString.apply([]) === '[object Array]'  // true
[].constructor === Array  // true

数组 VS 一般对象

• 相同
  • 都可以继承，数组是对象，对象不一定是数组，都可以当做对象添加和删除属性
• 不同
  • 数组自动更新length，按索引访问数组常常比访问一般对象属性明显迅速，数组对象继承Array.prototype上的大量数组操作方法