js常用代码和属性（最近更新时间20190902）
学习笔记不断更新总结
fill
1.语法
fill() 方法用于将一个固定值替换数组的元素
array.fill(value, start, end)
2.示例
fruits数组index从2开始到4之前元素替换成watermelon
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.fill("watermelon", 2, 4);
输出：Banana,Orange,watermelon,watermelon
注意: IE 11 及更早版本不支持 fill() 方法。
3.技巧场景
a.数组中需要添加null元素等
filter
1.语法
filter() 方法创建一个新的数组，新数组的元素通过检查制定数组中符合条件的所有元素
array.filter(function(currentValue,index,arr), thisValue)
2.示例
筛选出数组中满足大于18的数
var ages = [32, 33, 16, 40];
function checkAdult(age) {
return age >= 18;
}
console.log(ages.filter(checkAdult))
输出：32,33,40
3.技巧场景
a.[2==2,2===3].filter(Boolean),Boolean也可以作为第一个参数
b.静态删除某个元素时,使用filter去掉某个制定id的数值返回新的数组
function remove(id){
list = list.filter(item => {
return item.id !== id
})
}
es6-解构
1.语法
const { a, b } = array
2.示例
多层解构
var info={
name:'ct',
address:{
province:'fujian',
city:'xiamen'
}
}
const { name, address: { province, city } } = info
3.技巧场景
a.多层解构
es6-扩展运算符…
1.语法
{…info}
2.示例
基础复制数组
let person = {a:1, b:2}
let female = {...person}
let male = Object.assign({},person)
3.技巧场景
a.将数组转换为参数序列
function add(x, y) {
return x + y;
}
const numbers = [1, 2];
add(...numbers)
b.扩展运算符可以与解构赋值结合起来，用于生成数组,扩展运算符用于数组赋值，只能放在参数的最后一位
const [first, ...last] = [1, 2, 3, 4, 5];
first // 1
last // [2, 3, 4, 5]
c.将字符串转为真正的数组
[...'ct']
// [ "c", "t" ]
d.两个数组连接返回新的数组
标对象与源对象有同名属性，则后面的属性会覆盖前面的属性，可用在新增的场景
let a=[1,2]
let b=[2,3]
let c=[...a,...b]
//c: [1, 2, 2, 3]
let e = {a: 1, b: 2};
let f = {...e, ...{a:2, b: 4}}
// f: {a: 2, b: 4}
map
1.语法
map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值
array.map(function(currentValue,index,arr), thisValue)
| 参数 | 描述 | ||||||||
|---|---|---|---|---|---|---|---|---|---|
| function(currentValue, index,arr) | 必须。函数，数组中的每个元素都会执行这个函数 函数参数:
|
||||||||
| thisValue | 可选。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。 如果省略了 thisValue ，"this" 的值为 "undefined" |
2.示例
var arr = [10,20,30]
var result = arr.map(function (item,index,array) {
console.log(array[index])
return item+10
})
console.log(result)
[20, 30, 40]
3.技巧场景
a.修改数组某个数值
function update(id) {
list = list.map(item => {
return item.id === id ? { ...list, show: !item.show } : list
})
}
b.Math.sqrt等也可以作为函数传入
var numbers = [4, 9, 16, 25];
console.log(numbers.map(Math.sqrt))
// [2, 3, 4, 5]