javascript的小技巧笔记
- filter和map
- filter筛选数据（数据一样）
- map返回数组对象（长度一样）
- 深浅拷贝
- 浅拷贝
- 数组的深拷贝
- 奇淫巧计
- 数组去重
- 数组最大、最小
- 数组某个值的出现次数
- 返回两个数组的不同元素
- 返回两个数组的相同元素
filter和map
filter筛选数据（数据一样）
filter不会改变原数组,返回一个新的数组
return 对true和false判断
返回return true的子项
不会修改原数组的子项
- 长度：小于等于
- 数据：子集
例1：
let array1=['yma16','china']
let array2=array1
// 对原数组筛选
let array3=array2.filter((item,index)=>{
if(item=='china'){
item='changed'
console.log('原来子项',array2[index])
return true
}
})
console.log('array1',array1)
console.log('array2',array2)
console.log('array3',array3)
不对原来数组进行修改，产生原数组的子项
返回的数组是原数组的子集
例2：
即使数据被修改，返回的也是数据修改后子集
let array1=['yma16','china']
let array2=array1
// 对原数组筛选 修改子项
let array3=array2.filter((item,index)=>{
if(item=='china'){
console.log('原来子项',array2[index])
array2[index]='changed'
return true
}
})
console.log('array1',array1)
console.log('array2',array2)
console.log('array3',array3)
由于赋值为浅拷贝，array2传递为引用，当array2修改时array1也被修改
例3：
如果子项为字典，修改字典数据，
let array1=[{name:'yma16',country:'china'}]
let array2=array1
// 对原数组筛选 新增age
let array3=array2.filter((item,index)=>{
item.age=18
return true
})
console.log('array1',array1)
console.log('array2',array2)
console.log('array3',array3)
map返回数组对象（长度一样）
数组map返回的不一定是他的子项
- 数据：可以自定义
- 长度：与原数组保持一致
例1：
map不会对数组进行筛选，如果不返回数据，则默认返回undefined作为子项
let array1=['yma16','china']
let array2=array1
// 返回新数组
let array3=array2.map((item,index)=>{
if(item=='china'){
item='changed'
console.log('原来子项',array2[index])
return item
}
})
console.log('array1',array1)
console.log('array2',array2)
console.log('array3',array3)
深浅拷贝
浅拷贝
普通的赋值为浅拷贝，传递的是引用
例1：
let array1=['yma16','china']
let array2=array1
// 浅拷贝
array2.map((o,index)=>{
array2[index]='我是array2'
})
console.log('array1',array1)
console.log('array2',array2)
数组的深拷贝
数组的深拷贝
JSON.stringify将对象解析为字符串
JSON.parse将字符串解析为键值对
相辅相成
例1：
深拷贝数组，其地址指向不同
let array1=['yma16','china']
let array2=JSON.parse(JSON.stringify(array1))
// 深拷贝
array2.map((o,index)=>{
array2[index]='我是array2'
})
console.log('array1',array1)
console.log('array2',array2)
奇淫巧计
展开语法…
展开语法和 Object.assign() 行为一致, 执行的都是浅拷贝(只遍历一层)，可以在函数调用/数组构造时, 将数组表达式或者string在语法层面展开；还可以在构造字面量对象时, 将对象表达式按key-value的方式展开
例：展开语法深拷贝数组
let array1=['yma16','china']
let array2=[...array1]
// 深拷贝
array2.map((o,index)=>{
array2[index]='我是array2'
})
console.log('array1',array1)
console.log('array2',array2)
VM1696:7 array1 (2) ["yma16", "china"]
VM1696:8 array2 (2) ["我是array2", "我是array2"]
数组去重
function noRepeat(arr) {
return [...new Set(arr)]
}function noRepeat(arr) {
return Array.from(new Set(arr))
}
数组最大、最小
最大
function arrayMax(arr) {
return Math.max(...arr);
}最小
function arrayMin(arr) {
return Math.min(...arr);
}
数组某个值的出现次数
function countOccurrences(arr, value) {
return arr.reduce((a, v) => v === value ? a + 1 : a + 0, 0);
}返回两个数组的不同元素
function diffrence(arrA, arrB) {
return arrA.filter(v => !arrB.includes(v))
}返回两个数组的相同元素
function intersection(arr1, arr2) {
return arr2.filter(v => arr1.includes(v))
}
