ES6基础知识点1
- 1 let and Const
- 1.1 局部变量声明let
- 1.2 常量声明 const
- 2 解构
- 3 字符串
- 4 箭头函数
- 5 函数新特性
- 5.1 默认参数
- 5.2 不定参数
- 5.3 拓展实参
- 6 数组新增加方法
- 6.1 填充
- 6.2 copywithin
- 6.3 查找
- 7 对象
- 7.1 简写方式
- 7.2 对象的动态属性
- 7.3 对象的继承
1 let and Const
1.1 局部变量声明let
- 只能在一对{}里面产生作用,此时console.log(b)会报错，因为外部无法访问到局部变量b。
if(true){
var a = 15;
let b = 15;
}
console.log(a);
console.log(b);
- 不能重复声明一个局部变量。
- 不会变量提升，此时如果在变量声明前访问会报错，如下所示就会出现报错。
console.log(a);
let a = 15;
1.2 常量声明 const
- 声明必须赋值。
- 赋值后是否可以修改问题？
- 对于值类型不能修改， 值类型有 数字Number，字符串String，布尔 Boolean，未定义undefined。
- 对于引用类型可以修改，引用类型有数组Arry，对象object，空null。
const TOKEN = "ABC";
console.log(TOKEN)
const MY_HOST = ["www.baidu.com","www.qq.com"];//引用类型
MY_HOST.push("www.jd.com");
MY_HOST[0] = "www.tmall.com";
console.log(MY_HOST);
- 变量名建议大写。
2 解构
2.1 对象
- 基础
var obj = {name:"jack",age:19,weight:128};
let {weight,name} = obj;
console.log(name,weight)
- 剩余值
var obj = {name:"jack",age:19,weight:128};
let {weight,...rest} = obj;
console.log(weight,rest)
- 默认值,当obj中没有eye 的键名时，会直接调用默认值，反之会调用eye的值，不会调用默认值。
var obj = {name:"jack",age:19,weight:128};
let {name,eye=2} = obj;
console.log(name,eye)
- 没有顺序区分，变量名必须与对象的键名一样。
2.2 数组
- 基础
let arr = [1, 3, 5, 7, 9];
let [a, b, c] = arr;
console.log("a:",a);
console.log("b:",b);
console.log("c:",c);
- 剩余值
let arr=[1,2,3,4];
let [a,...b]=arr;
console.log(a,b)
- 默认值
let arr=[1,2,3,4];
let [a,b,c=100]=arr;
console.log(a,b,c)
- 交换变量
let a=15;
let b=23;
[a,b]=[b,a];
console.log(a,b)
- 跳过（忽略）
let arr=[1,2,3,4];
let [,a,,b]=arr;
console.log(a,b)
- 浅拷贝（复制）
var arr=[1,3,5];
var arr1=[...arr];
arr1[1]=100;
console.log(arr,arr1)
3 字符串
- 去除空白
- 去除两边空白 trim();
- 去除左边空白 trimLeft()
- 去除右边空白 trimRight()
- 检测包含
- includes(s) 字符串是否包含s
- starsWith(s) 字符串是否已s开头
- endsWith(s) 字符串是否已s结尾
- 重复 repeat(number)
- 填充
- padStart(len,s ) 以字符串s补齐len长度，s在前
- padEnd(len,s ) 以字符串s补齐len长度，s在后
-模板
```
var name = "圣京都";
var age = 18;
var str = `大家好我的名字是"${name}"，今年${age}岁了`;
console.log(str);
```
4 箭头函数
4.1 原来的函数
function times(n){
console.log(n*2)
}
times(6);
4.2 箭头函数
- 参数=>函数体
- 如果参数不仅仅一个，用（）包裹
- 如果函数体只有一句，执行的结果就是返回值
- 函数体多条语句：1.用{}包裹；2.return 返回
var times=n=>console.log(n*2);
times(4)
var arr=["jack","tom","anbi"];
arr.forEach(item=>console.log(item))
var arr =[1,2,3,4];
var ret=arr.reduce((a,b)=>a+b);
console.log(ret)
var arr=[{num:1},{num:2}]
var arr2=arr.map(item=>({num:item}))
console.log(arr2)
- 1.默认setinterval this指向window
2.箭头函数的this指向为上一层作用域中的this obj;
var obj={
age:18,
say:function(){
console.log("今年我"+this.age);
},
grow:function(){
setInterval(()=>{
this.age++;
this.say();
},3000)
}
}
obj.say();
obj.grow();
5 函数新特性
5.1 默认参数
function add(a,b=10){
console.log(a+b)
}
add(3)
5.2 不定参数
function add(...args){
var ret =args.reduce((a,b)=>a+b);
console.log(ret)
}
add(1,2,3,4,5,6)
5.3 拓展实参
function metting(a,b,c,d){
console.log("今天开会的有:",a,b,c,d);
}
var arr=["jack","tom","小米","安比","夏娜"];
metting(...arr)
6 数组新增加方法
6.1 填充
- fill(“填充内容”,start,end) 其中不包括end下标的元素
var arr=[1,2,3];
arr.fill("jack",0,1);
console.log(arr)
6.2 copywithin
- 从数组拷贝替换元素copywithin(替换开始位置,拷贝开始位置，拷贝结束位置)
var arr=[1,2,3,4,5];
arr.copyWithin(0,1,2);
console.log(arr);
6.3 查找
- includes（obj）返回一个值，arr 是否包含obj
var arr=[1,2,3];
console.log(arr.includes(1))
var arr=[11,33,2,33,50,100];
var set=arr.find(item=>item>24)
console.log(set)
var arr=[11,33,2,33,50,100];
var set=arr.findIndex(item=>item>50)
console.log(set)
7 对象
7.1 简写方式
var name="jack";
var age=18;
var user={
name,
age,
say(){
console.log(`名字${this.name} 年龄${this.age}`)
}
}
console.log(user.say())
7.2 对象的动态属性
var Key=prompt("输入对象名称","like");
var value=prompt("输入对象值","好好学习");
var obj={[key+"web"]:value}
console.log(obj)
7.3 对象的继承
var man={
leg:2,
walk(){
console.log("两条腿走路");
}
}
var teacher={
name:"Jack",
__proto__:man
}
console.log(teacher.walk())
