js数组操作整理

删除数组元素

pop() :删除数组的最后一个元素，返回删除的数组

let arr1 =[1,2,3,4,5]
console.log(arr1.pop())    //5
console.log(arr1) //[ 1, 2, 3, 4 ]

shift() 删除数组的第一个元素，返回删除的数组

let arr =[1,2,3,4,5]
console.log(arr.shift()) //1
console.log(arr) //[ 2, 3, 4, 5 ]

splice(i,n) 删除从i(索引值)开始之后的n元素

let arr =[1,2,3,4,5]
console.log(arr.splice(0,2)) //[ 1, 2 ]
console.log(arr) //[ 3, 4, 5 ]

添加数组元素

unshift() 方法可向数组的开头添加一个或更多元素，并返回新的长度。

let arr =[1,2,3,4,5]
console.log(arr.unshift(9))    //6 返回长度
console.log(arr)    //[ 9, 1, 2, 3, 4, 5 ]

push（） 在数组最后面添加元素，返回更新数组后的长度

let arr =[1,2,3,4,5]
console.log(arr.push('name')) //6
console.log(arr) //[ 1, 2, 3, 4, 5, 'name' ]

sort() 将数组进行排序

let arr  = [1,3,4,2,3,123,35,65,44,333,33]
//正序输出
let resArr = arr.sort((a,b)=>{
    return a - b;
})
console.log(resArr);//[1,2,3,3,4,33, 35, 44, 65, 123, 333]
console.log(arr)    //[1,2,3,3,4,  33,35, 44, 65, 123, 333]
let arr1 = [{id:2},{id:13},{id:6},{id:21},{id:5},{id:3}];
//正序
let resArr1 = arr1.sort((a,b)=>{
    return a.id - b.id;//这里可以直接写进参数里
});
console.log(resArr1 ) //[ { id: 2 }, { id: 3 }, { id: 5 }, { id: 6 }, { id: 13 }, { id: 21 } ]
console.log(arr1) // [ { id: 2 }, { id: 3 }, { id: 5 }, { id: 6 }, { id: 13 }, { id: 21 } ]

reverse() 将数组反转

let arr =[1,2,3,4,5]
console.log(arr.reverse()) //[ 5, 4, 3, 2, 1 ]
console.log(arr) //[ 5, 4, 3, 2, 1 ]

forEarch() 遍历

• 循环数组中的每一项
• 三个参数 ： 参数item:数组中的当前项目，参数index: 当前项的索引 ，obj 原始数组

let arr =['a','b','c']
arr.forEach((item,index,obj) =>{
    console.log(item,index,obj)}
)

• 运行结果
  
• 函数中的this 指向window

let arr =['a','b','c']
  arr.forEach((item,index,obj) =>{
    // console.log(item,index,obj)
    console.log(this)
  })

• forEach没有返回值

let arr =['a','b','c']
 let ren = arr.forEach((item,index,obj) =>{
    // console.log(item,index,obj)
    // console.log(this)
    return item
})
console.log(ren)

• 改变原数组

let arr =[1,2,3]
 let ren = arr.forEach((item,index,obj) =>{
     console.log(item,index,obj)
     obj[index] = item + 1
})
console.log(arr)

运行效果:

• 函数中的this指向window

let arr =[1,2,3]
  let ren = arr.map((item,index,obj) =>{
      // console.log(item,index,obj)
      console.log(this)
  })

运行效果：

• 有返回值，返回新数组

let arr =[1,2,3]
 let ren = arr.map((item,index,obj) =>{
     return item +1
})
console.log(arr)
console.log(ren)

运行效果：

map 遍历

• 循环数组中的每一项
• 参数item:数组中的当前项目,参数index: 当前项的索引, obj 原始数组

let arr =[1,2,3]
let ren = arr.map((item,index,obj) =>{
    console.log(item,index,obj)
})

运行结果：

slice(start,end) 切去索引值start到索引值end的数组，不包含end索引的值，

let arr =[1,2,3,4,5]
console.log(arr.slice(1,3)) //[ 2, 3 ]
console.log(arr) //[ 1, 2, 3, 4, 5 ]

some() 方法用于检测数组中的元素是否满足指定条件

• 如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。
• 如果没有满足条件的元素，则返回false。
• some() 不会对空数组进行检测。
• some() 不会改变原始数组。

let arr =[8,9,3]
let res = arr.some((item,index,obj) =>{
    return item >5
})
console.log(res) //true
let res1 = arr.some((item,index,obj) =>{
    return item >10
})
console.log(res1) //false
console.log(arr) //[ 8, 9, 3 ] 不会改变原数组

every() 方法用于检测数组所有元素是否都符合指定条件

• 如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。
• 如果所有元素都满足条件，则返回 true。
• every() 不会对空数组进行检测。
• every() 不会改变原始数组。

let arr =[8,9,3]
let res = arr.every((item,index,obj) =>{
    return item >5
})
console.log(res) //false ,如果数组中检测到有一个元素不满足，则整个表达式返回 false 
let res1 = arr.every((item,index,obj) =>{
    return item >2
})
console.log(res1) //true 如果所有元素都满足条件，则返回 true
console.log(arr) //[ 8, 9, 3 ] 不会改变原数组

find()方法用于查找数组中符合条件的第一个元素，如果没有符合条件的元素，则返回undefined

• find() 对于空数组，函数是不会执行的。
• 不会改变原数组

let arr1 = [1, 2, 3, 4, 5];
let num = arr1.find(item => item > 1);
console.log(num)  //輸出的結果是2
console.log(arr1) //[ 1, 2, 3, 4, 5 ]
var arr = [{
    id: 1,
    name: '一',
}, {
    id: 1,
    name: '二',
}, {
    id: 2,
    name: '三',
}]
let obj = arr.find(item => item.id == 1)
let obj1 = arr.find(item => item.id == 6)
console.log(obj); //{ id: 1, name: '一' }
console.log(obj1) //undefined //没有符合条件的元素，则返回undefined
console.log(arr) //[ { id: 1, name: '一' }, { id: 1, name: '二' }, { id: 2, name: '三' } ]

filter() 方法用于把数组中的某些元素过滤掉，然后返回剩下的未被过滤掉的元素。

• 不会对空数组进行检测
• 不会改变原始数组

let arr1 = [1, 2, 3, 4, 5];
let num = arr1.filter(item => item > 1);
console.log(num) //[ 2, 3, 4, 5 ]
console.log(arr1) //[ 1, 2, 3, 4, 5 ]
let num1 = arr1.filter(item => item > 6);
console.log(num1) //[]
var arr = [{
    id: 1,
    name: '一',
}, {
    id: 1,
    name: '二',
}, {
    id: 2,
    name: '三',

}]
let obj1 = arr.filter(item => item.id >1)
let obj2 = arr.filter(item => item.id >3)
console.log(obj1) //[ { id: 2, name: '三' } ]
console.log(obj2)//[]
console.log(arr)//[ { id: 1, name: '一' }, { id: 1, name: '二' }, { id: 2, name: '三' } ]

includes()函数用来判断一个数组是否包含一个指定的值，包含则返回true，否则false

let arr= ['1','2','3'];
console.log(arr.includes('1')); //true
console.log(arr.includes('7')); //false

reverse方法是将数组中的元素的顺序进行反转

• reverse方法能否用于undefined与null上

let c =null
let u = undefined
console.log(c.reverse()) //报错TypeError
console.log(u.reverse()) //报错TypeError

let a =[null]
let b =[ undefined]
console.log(a.reverse()) // 输出结果：[ null ]
console.log(b.reverse()) // 输出结果：[ undefined ]

• 空数组上运行reverse方法 输出空数组

let e =[]
console.log(e.reverse()) // 输出结果：[]

• reverse方法返回数组本身

let arr =[false,undefined,null]
console.log(arr.reverse()) //输出结果 [ null, undefined, false ]
console.log(arr) //输出结果 [ null, undefined, false ]
let arr1 =['a','b','c',true]
let arr2 =['a','b','',true]
console.log(arr1.reverse())  //输出结果[ true, 'c', 'b', 'a' ]
console.log(arr1)// 输出结果 [ true, 'c', 'b', 'a' ]
console.log(arr2) //输出结果 [ 'a', 'b', '', true ]

concat（）方法是用于连接两个或多个数组

• 语法： array1.concat(array2,array3,…,arrayX)

let arr1 =[1,2,3]
let arr2=['a','b','c',null]
let arr3 =['name','','age']
console.log(arr1.concat(arr2,arr3)) //[1,2,3,'a','b', 'c',null,'name', '',  'age']

join()方法就是将array数据中每个元素都转为字符串，用自定义的连接符分割

• join(‘’)将数组元素无缝拼接

let s = ['a','p','p','l','e']
console.log(s.join('')) // apple

• join(’ ') 将数组元素以空格分割

let s = ['Apple','is','on','my','like']
console.log(s.join(' ')) // 输出结果： Apple is on my like

• join()将数组每个元素都转为字符串，用法等同于toString()

let s = ['a','b','c']
console.log(s) // 输出结果为：[ 'a', 'b', 'c' ]
console.log(s.join()) //输出结果为：a,b,c

持续更新中。。。