一、数组的扩展
...a叫做rest参数
function fn(...a){
console.log(a);
//arguments
}
fn(1, 2, 3, 4, 5)
var box1 = document.getElementsByTagName("div");
var box2 = document.querySelectorAll("div");
console.log(box1, box2)
console.log(...box1, ...box2)
console.log([...box1])
//不能模拟一个类数组对象来转变成为数组
var obj = {
0:"div",
1:"div",
2:"div",
"length":3
}
console.log(...obj)
let arr1 = [1, 2, 3];
console.log(Math.max.apply(null, arr1))
let arr2 = ['a', 'b', 'c']
let arr3 = arr1.concat(arr2)
console.log(arr3)
let arr4 = [...arr1, ...arr2]
console.log(arr4)
let str = "Hello";
console.log([...str])
二、Array.from().of()
Array.from方法用于将两类对象转为真正的数组
function fn(a, b, c){
var args = Array.from(arguments);
console.log(arguments)
console.log(args)
}
fn(1, 2, 3)
let ps = document.querySelectorAll("p");
Array.from(ps).forEach(function (p){
console.log(p);
});
在构建函数中，如果我们传入多个值的情况，会返回一条数组
如果传入一个值的情况，返回的是一个长度为这个值的空数组
Array.of()：这个方法的主要目的是弥补数组构造函数Array()的不足，因为参数个数的不同，会导致Array()的行为有差异
var arr = Array(1, 2, 3)
var arr1 = Array(3)
var arr2 = Array.of(3)
console.log(arr, arr1, arr2)
三、copyWithin()
它接受三个参数
- target（必需）：从该位置开始替换数据【从下标为零开始替换】
- start（可选）：从该位置开始读取数据，默认为0，如果为负值，表示倒数
- end（可选）：到该位置前停止读取数据，默认等于数组长度。如果为负值，表示倒数
console.log([1, 2, 3, 4, 5].copyWithin(0, 3));
console.log([1, 2, 3, 4, 5].copyWithin(0, 4));
console.log([1, 2, 3, 4, 5].copyWithin(0, 3, 4));
四、find()，findIndex()
find()：直到找出第一个返回值为true的成员，然后返回该成员（只返回第一个值为true的内容）
console.log([1, 5, 10, 15].find(function(value, index, arr){
return value > 9;
}))
findIndex()：返回下标
console.log([1, 5, 10, 15].findIndex(function(value, index, arr){
return value > 9;
}))
``
五、fill()、for...of()
fill()：fill方法使用给定值，填充一个数组。fill方法用于空数组的初始化非常方便。数组中已有的元素，会被全部抹去
console.log(['a', 'b', 'c'].fill(7))
for...of返回的是值：es6引入的作为遍历所有数据结构的统一的方法，遍历返回的值是所有值
for...in返回的是键
let arr = ['a', 'b', 'c'];
for(let key of arr){
console.log(key)
}
//keys()是对键名的遍历
for(let index of ['a', 'b'].keys()){
console.log(index);
}
//values()是对键值的遍历
for(let elem of ['a', 'b'].values()){
console.log(elem);
}
//entries()是对键值对的遍历
for(let [index, elem] of ['a', 'b'].entries()){
console.log(index, elem);
}
六、对象的扩展
let person = "zhangsan";
var json = {
person:person, //es5
person, //es6
fn:function(){ //es5
},
fn(){ //es6
},
fn1:() => true
}
console.log(json.person)
console.log(json.fn())
console.log(json.fn1())
七、对象简洁表示法
var abc = "xyz";
var obj = {
"a":1,
"b":2,
"c":3,
["a"+"b"]:888, //["a" + "b"]当成一个键值
[abc]:123,
"abc":456
}
console.log(obj.a)
console.log(obj["a"+"b"]) //不是同时来获取到两个值
console.log(obj.ab) //点操作获取值
console.log(obj[abc])
console.log(obj["abc"])
console.log(obj.xzy)
//Object.is()
+0 === -0 //true
NaN === NaN //false
Object.is(+0, -0) //false
Object.is(NaN, NaN) //true
八、对象的方法
Object.assign()：此方法用于对象的合并，将源对象（source）的所有可枚举（可遍历）属性，复制到目标对象（target）
const target = {a:1};
const source1 = {b:2};
const source2 = {c:3};
console.log(Object.assign(target, source1, source2));
九、let与var的区别
for(var i = 0; i<divs.length; i++){
divs[i].onclick = function(){
console.log(i)
}
}
for(let i = 0;i<divs.length; i++){
divs[i].onclick = function(){
console.log(i)
}
}
