- 箭头函数
1-1
function method(){
}
let methods=()=>{
}
let methods=a=>{
}
let methods=(a,b)=>{
}
1-2 /
let data=()=>{
//执行代码
return true; }
let data=()=>true;
1-3 特点保持上下文this指针一致
console.log(this);//window
let obj = {
sleep: function () {
console.log(this);//obj
setTimeout(() => {
console.log(this);//obj
}, 1000);
// setTimeout(function (){
// console.log(this);//window
// //如果要使用obj
// }, 1000);
}
}
obj.sleep();
1-4 匿名函数变箭头，对象上的 函数直接简写
1-5 es6中的函数 可以进行参数的默认值
let stus = (x = 2, y = 10) => {
console.log(x, y);//undefined
}
stus();
console.log(stus.length); //返回函数没有指定默认值个数
函数 一个属性 length 获取的是当前形参的个数值
1-6 函数和解构赋值搭配使用
let fun=(a,...b)=>{
console.log(a,b);
}
fun(1,2,3,4);
对象解构
let fun = ({
a, b }) => {
console.log(a, b);
}
fun({
a: 1, b: 2 });
//解构别名
let {
a, a: [x, y] } = {
a: [1, 2] };
1-7 函数作用域
let s1=10;
let fun2=(x,y=s1)=>{
let s1=20;
console.log(y);//10
}
fun2();
}
1-8 es6 引入的rest 参数 ，获取函数多余的参数 使用是 扩展运算符 …
let fun3 = function (...values) {
console.log(arguments);
console.log(values,);
}
fun3(1, 2, 3, 4);
1-9 函数的name属性
console.log(fun3.name)//fun3
1-10 箭头函数有几个使用注意点。
（1）函数体内的this对象，就是定义时所在的对象，而不是使用时所在的对象。
（2）不可以当作构造函数，也就是说，不可以使用new命令，否则会抛出一个错误。
（3）不可以使用arguments对象，该对象在函数体内不存在。如果要用，可以用 rest 参数代替。箭头函数中写arguments对象 会报错， 因为箭头函数特点 上下文this保持一致 window 中不含arguments
- 数组的扩展
2-1 扩展运算符 等价 函数扩展上的reset参数的逆运算
// let a=[12,3,4];
// let b=[...a];//12 3 4
// let fun=(...values)=>{
// console.log(values);// [1,2,3,4,5]
// }
// fun(1,2,3,4,5);
let a1 = [1, 2, 3];
let b1 = [...a1];
b1[0] = 10;
console.log(a1);//1,2,3
类数组 可以使用扩展运算符
let btn = document.getElementsByClassName('btn');
console.log(...btn);
2-2 获取数组中的最大值
let arr1 = [9, 1, 3, 2, 5, 4];
//let max=Math.max.apply(null,arr1);
//let max=Math.max(9,1,3,2,5,4);
let max = Math.max(...arr1);
console.log(max);
2-3 es6 合并数组 es5 concat合并
let a2 = [1, 2, 3];
let a3 = [4, 5, 6];
let a4 = [7, 8, 9];
//es5 合并
console.log(a2.concat(a3, a4));
console.log(a2.concat(a3).concat(a4));
//es6 合并
console.log([...a2, ...a3, ...a4]);
2-4 Array.from() 将类数组 转化为数组
let btnlist = document.getElementsByClassName('btn');
console.log(Array.from(btnlist));
2-5将一组值转化为数组 Array.of()
console.log(Array.of(1, 2, 3, 4, 5, 6));
console.log(Array.of.call(null, 1, 2, 3, 4, 5, 6));
console.log(Array.of.apply(null, [1, 2, 3, 4, 5, 6]));
2-6 复制 数组中的值copyWithin
let list = [1, 2, 3, 4, 5];
//第一参数默认位置 开始替换
//start 位置开始
//end 位置结束
//在数组中取某一段值 从那个位置开始覆盖
// let info=list.copyWithin(1,0,3);
let info = list.copyWithin(0, -2, -1);
console.log(info);
2-7 find 方法 返回第一个满足条件的值
find 找到满足条件的 返回当前的第一个值 未找到返回undefined
let item=[1,2,3,4,5,6];
let result=item.find((value,index,arr)=>{
return value%7==0;
});
console.log(result);
2-8findIndex 类似find 返回的是满足条件的第一个值的索引 未找到返回的是-1
let index=item.findIndex((item,index,arr)=>{
return item%7==0;
});
console.log(index);//-1
2-9fill 使用给定的值 填充数组， fill （value start end），赋值，开始位置，结束位置
console.log(item.fill('a'));
// fill value start end
console.log(item.fill('b',0,3));
2-10 entries()，keys()和values()，这三个方法 全是针对数组遍历使用
let tea=[1,2,3,4,5];
console.log(tea.keys());//返回的是key值的迭代器
for(let key of tea.keys()){
console.log(key);
}
let sd=[{
name:'aaa',age:23}];
console.log(Array.from(sd).keys());
for(let key of Array.from(sd).keys()){
console.log(key);
}
console.log(tea.values());
for(let key of tea.values()){
console.log(key);
}
console.log(tea.entries());
for(let item of tea.entries()){
console.log(item);
}
上面的三个方法 entries()，keys()和values() 返回的都是迭代器Iterator
下面这个先了解
// let interator=tea.keys();
// console.log(interator.next()); //{
value: 0, done: false}
// console.log(interator.next()); //{
value:1, done: false}
// console.log(interator.next()); //{
value: 2, done: false}
// console.log(interator.next()); //{
value:3, done: false}
// console.log(interator.next()); //{
value:4, done: false}
// console.log(interator.next()); //{
value:undefined, done: true}
2-11 includes 方法 检索数组里面是否包涵某个值 返回true false
不管是正值负值都是left到right
let da=[1,2,3,4,5];
console.log(da.includes(1));//true
console.log(da.includes(1,2));//false
console.log(da.includes(1,-5));//false
2-12 降低数组维度
es6 自动降 flat() 默认无参 降1层
let k=[1,2,3,[4,5],[[5,6,7],[8,9,[10,11,[12,13]]]]];
console.log(k.flat(4));
2-13 flatMap 映射，//flatMap 类似映射map 但是在函数的返回值上默认执行了一次flat()
// let m=[1,2,3,4,5];
// let rm=m.flatMap((value,index,item)=>{
// return [[value*2]];
// });
// console.log(rm);
let m=[1,2,3,4,5];
let rm=m.flatMap((value,index,item)=>{
return [[value*2]].flat();
});
console.log(rm);
2-14sort
let mk=[9,3,4,2,1,5];
console.log(mk.sort());//默认小-大
console.log(mk.sort((x,y)=>{
return Math.random()-0.5;//数组打乱排序的方法
}));
总结：1.arguments是什么
2. 多行选择，按滚轮往下拉
3. 自己实现map 映射方法
Array.prototype.fakeMap=function(fn,context){
console.log(context);
let arr=this;
let temp=[];
for(let i=0;i<arr.length;i++){
let result=fn.call(undefined,arr[i],i,arr);
temp.push(result);
}
return temp;
}
let array=[1,2,3,4];
array.fakeMap(function(item,index,arr){
console.log(this);
});
4.型链方法中的this指 当前对象
5. reduce 累计器 返回最终值
//1 -100
let a=[1,2,3,4,5];
let res=a.reduce(function (x,y){
console.log(x,y);
//必须得有返回值
return x+y;
});
console.log(res);
6.回顾call apply
//替换前面方法中的this指针，传递参数 执行方法
//call 传递参数为序列型
//apply 传递参数为集合型
7. 有通过对象点的 有通过类点的
//静态（静态属性静态方法用类点） 动态（动态方法和动态属性使用对象点）