这是我参与8月更文挑战的第5天,活动详情查看:8月更文挑战
forEach
forEach会改变原来的数组
var arr = [1, 2, 3, 4];
var sum = 0;
arr.forEach(function(value, index, array) {
array[index] = array[index] * 100; //结果为true
sum += value;
});
console.log(sum); //10
console.log(arr); //[100, 200, 300, 400]
使用forEach给数据添加一个属性isShow, 控制照片的显示与隐藏
//第一点 使用forEach给数据循环添加一个属性isShow, 控制照片的显示与隐藏
let list = [{
"publishInstitution": "惠来县气象台",
"type": "yellow_11B09"
}, {
"publishInstitution": "陆河县气象台",
"type": "orange_11B09"
}, ]
list.forEach(item => {
item.isShow = true
});
console.log(list) //[{"publishInstitution":"惠来县气象台","type":"yellow_11B09","isShow":true},{"publishInstitution":"陆河县气象台","type":"orange_11B09","isShow":true}]
let newList = JSON.parse(JSON.stringify(list)) //深拷贝,使数据可以被监听到,解决数据更新了,但是页面不更新的问题
//第二点,
const type = "orange_11B09"
newList.forEach(item => {
if (item.type == type) {
item.isShow = false
}
})
console.log(newList) //[{"publishInstitution":"惠来县气象台","type":"yellow_11B09","isShow":true},{"publishInstitution":"陆河县气象台","type":"orange_11B09","isShow":false}]
js树形结构截取前面两级
//
let treeData = [{
id: 0,
name: '00',
children: [{
id: 1,
name: '01',
children: [{
id: 11,
name: '11',
children: [{
id: 13,
name: '13',
children: [],
}],
}]
},
{
id: 2,
name: '02',
children: [{
id: 22,
name: '22',
children: [],
}]
}
]
}]
console.log(interceptLevel(treeData, 3));
// 数据来源截取(data数据结构,index需要保留的层级)
function interceptLevel(data, index) {
index--;
return data.map(e => {
if (e.children && index > 0) {
interceptLevel(e.children, index);
} else {
delete e.children;
}
return e;
})
}
js 判断字符串中是否包含某个字符串
indexOf()
indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。如果要检索的字符串值没有出现,则该方法返回 -1。
var str = "123";
console.log(str.indexOf("3") != -1 ); // true
find()
使用场景:选择器中页面显示的值与接口通信时的值不一致时需要
const examTypes = [{
"text": "全国大学英语四级考试(CET4)",
"key": 1
}, {
"text": "全国大学英语六级考试(CET6)",
"key": 2
}, {
"text": "全国大学日语四级考试(CJT4)",
"key": 3
}, {
"text": "全国大学日语六级考试(CJT6)",
"key": 4
}, {
"text": "全国大学德语四级考试(PHS4)",
"key": 5
}, {
"text": "全国大学德语六级考试(PHS6)",
"key": 6
}, {
"text": "全国大学俄语四级考试(CRT4)",
"key": 7
}, {
"text": "全国大学俄语六级考试(CRT6)",
"key": 8
}, {
"text": "全国大学法语四级考试(TFU4)",
"key": 9
}]
const text = "全国大学英语四级考试(CET4)"
const key = examTypes.find(i => i.text === text).key
console.log(key)//1
map()
map()不改变原来的数组
一种使用场景:将一个数组对象转换成只包含其他一个元素的数组,如下例子:
const examTypes = [{
"text": "全国大学英语四级考试(CET4)",
"key": 1
}, {
"text": "全国大学英语六级考试(CET6)",
"key": 2
}, {
"text": "全国大学日语四级考试(CJT4)",
"key": 3
}, {
"text": "全国大学日语六级考试(CJT6)",
"key": 4
}, {
"text": "全国大学德语四级考试(PHS4)",
"key": 5
}, {
"text": "全国大学德语六级考试(PHS6)",
"key": 6
}, {
"text": "全国大学俄语四级考试(CRT4)",
"key": 7
}, {
"text": "全国大学俄语六级考试(CRT6)",
"key": 8
}, {
"text": "全国大学法语四级考试(TFU4)",
"key": 9
}]
const newExamTypes = examTypes.map(item => item.text)
console.log(newExamTypes) //["全国大学英语四级考试(CET4)", "全国大学英语六级考试(CET6)", "全国大学日语四级考试(CJT4)", "全国大学日语六级考试(CJT6)", "全国大学德语四级考试(PHS4)", "全国大学德语六级考试(PHS6)", "全国大学俄语四级考试(CRT4)", "全国大学俄语六级考试(CRT6)", "全国大学法语四级考试(TFU4)"]
使用场景,通过路由跳转到详情页面,最好定义好参数,如index ,可以方便日后随机下架入口
const ecologyQuery = [
"气象灾害预警",
"全国重点城市空气质量实时数据查询",
"全国重点城市空气质量日报查询",
"全国排污许可证查询",
"建设项目环评已批准项目审批情况查询"
]
const ecologyUri = "views/EcologyService/Query?index="//路由
const listData = ecologyQuery.map((item, index) => {
return {
name: item,
uri: ecologyUri + index
}
})
console.log(listData) //[{"name":"气象灾害预警","uri":"views/EcologyService/Query?index=0"},{"name":"全国重点城市空气质量实时数据查询","uri":"views/EcologyService/Query?index=1"},{"name":"全国重点城市空气质量日报查询","uri":"views/EcologyService/Query?index=2"},{"name":"全国排污许可证查询","uri":"views/EcologyService/Query?index=3"},{"name":"建设项目环评已批准项目审批情况查询","uri":"views/EcologyService/Query?index=4"}]
在chrome中复制完整Array, Object的方法
有的时候在chrome打印出来的Array、Object的方法很方便阅读,但是不太方便复制,接下来介绍一种可以方便复制出来的方法:
1.第一步:显示
2.第二步:右键选中Store object as global variable
3.输入JSON.stringify(temp1)即可复制