forEach 的经验
1.当数组中元素是值类型，forEach 绝对不会改变数组
var arr = [1, 2, 3]
arr.forEach((a) => {
a = a * 2
})
// => [1,2,3]
2.当是引用类型，则可以改变数组
var arr = [{ name: '张三', age: 18 }, { name: '李四', age: 19 }]
arr1.forEach((a) => {
a.age = a.age + 1
})
//=> [{name:'张三',age:19},{name:'李四',age:20}]
3.forEach 不支持链式调用,有返回值的支持链式调用.
let arr = [1,2,3,4]
arr.forEach(a=>{
console.log(1)
}).sort((a,b=>{
return a > b
}))
=>Uncaught SyntaxError: Identifier 'arr' has already been declared
at <anonymous>:1:1
let arr = [1,2,3,4]
arr.filter(a=>{
return a > 1
}).sort((a,b)=>{
return a > b
})
4.后台返回的数据通过 forEach 处理时会赋值不成功，可以通过 JSON 先编码再解码解决
let b = res.data.data
b = JSON.parse(JSON.stringify(b))
sort 排序
1.比较值类型
[5,2,3,4].sort((a,b)=>{return a - b})
=>比较值类型 a-b 从小到大 b-a从大到小
2.比较引用类型
[{name:'张三',age:'10'},{name:'李四',age:'19'}].sort((a,b)=>{return a.age - b.age})
=>比较值类型 a-b 从小到大 b-a从大到小
set 去重
1.new set() 得到的值是一个对象,可以使用 add()方法,add 相同的值添加不进去,但是添加的是相同的引用类型可以添加(它的缺点,不能去重元素是引用对象的数组)
let tempArr = new Set([1,2,3,3,4,4,5])
tempArr.add(1)
tempArr.add(1)
tempArr.add({name:'张三'});
tempArr.add({name:'张三'});
console.log([...tempArr])
=>
0: 1
1: 2
2: 3
3: 4
4: 5
5: {name: "张三"}
6: {name: "张三"}
Lodash 的 _.uniqWith()去重
// import _ from 'lodash';
var objects = [{ x: 1, y: 2 }, { x: 2, y: 1 }, { x: 1, y: 2 }]
_.uniqWith(objects, _.isEqual)
//=> [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }]
数组对象合并,并且根据自定义字段排序
let roles = [
{ roleName: '本人', value: '' },
{ roleName: '配偶', value: '' },
{ roleName: '父母', value: '' },
{ roleName: '子女', value: '' }
]
let roles1 = [
{ roleName: '配偶', value: 'peiou' },
{ roleName: '本人', value: 'benren' },
{ roleName: '子女', value: 'zinv' },
{ roleName: '父母', value: 'fumu' }
]
roles = roles.map((item, index) => {
return { ...item, ...roles1[index] }
})
console.log(roles)
>>
(4) [{…}, {…}, {…}, {…}]
0: {roleName: "配偶", value: "peiou"}
1: {roleName: "本人", value: "benren"}
2: {roleName: "子女", value: "zinv"}
3: {roleName: "父母", value: "fumu"}
length: 4
roles.sort((a, b) => {
//根据order数组的顺序排序
let order = ['本人', '配偶', '父母', '子女']
return order.indexOf(a.roleName) - order.indexOf(b.roleName)
})
console.log(roles)
>>
(4) [{…}, {…}, {…}, {…}]
0: {roleName: "本人", value: "benren"}
1: {roleName: "配偶", value: "peiou"}
2: {roleName: "父母", value: "fumu"}
3: {roleName: "子女", value: "zinv"}
length: 4
//存在一点问题，修改一下
roles = roles.map(a => {
roles1.forEach(b => {
if (a.roleName == b.roleName) {
a = b
}
})
return a
})
解决移动端苹果手机点击 input 会向上移动的问题和点击其他地方不会失去焦点
document.getElementById('pwd').addEventListener('focus', function() {
document.body.scrollTop = 0
})
document.body.addEventListener(
'touchmove',
function(e) {
document.documentElement.scrollTop = 0
e.preventDefault()
},
{
passive: false,
}
) //passive 参数不能省略，用来兼容ios和android
document.querySelector('body').addEventListener('touchend', function(e) {
if (e.target.className != 'input') {
document.getElementById('pwd').blur()
}
})
