es6基本语法(es6的语法有哪些)
导语：1、ES6基础语法
变量的声明
let
const
数组的赋值
对象的赋值
字符串结构赋值
字符串扩展
模版字符串
剩余参数
扩展运算符
箭头函数
函数
变量的声明
let
let声明的变量在同一个作用域内不允许重复；
{
let flag = &39;; // 无法在外部访问flag
console.log(flag);
}
const
声明的变量不允许改变；
const i = 1;
console.log(i);
数组的赋值
// JavaScript
var a=1,b=2,c=3;
console.log(b)
// ES6
var [a,b,c]=[4,5,6] // var [a,b=100,c]=[4,5,6] b=100是指定默认值
console.log(b)
// 数组合并
let arr1=[1,2,3]
let arr2=[4,5,6]
let arr3=[...arr1,...arr2]
console.log(arr3)
对象的赋值
let {foo,bar}={bar:,foo:}
let {foo:abc,bar}={bar:,foo:} // abc是变量的设置了别名，那么此时foo就无法使用了
// 指定默认值
let {a=100}={}
console.log(a) // 100
字符串结构赋值
let [a,b,c]=&39;
console.log(a,b,c) // h e l
字符串扩展
includes：判断字符串当中是否有指定的子串；
参数一：匹配的字符串；
参数二：判断是起始位置；
startsWith：判断字符串是有是以什么开头；
endsWith：判断字符串是有是以什么结尾；
模版字符串
let obj = {
name:,
age:18,
city:
}
let fn=function (data){
return data
}
let cce = `${obj.city}+${1+1}+${fn(&39;)}` // 反引号表示模版，模版中的内容可以有格式，以${}的方式填充数据
console.log(cce)
剩余参数
function cce(a,...rest){
console.log(a,rest)
}
cce(&39;,&39;,&39;) //a [ &39;, &39; ]
扩展运算符
function cce(a,b,c){
console.log(a+b+c)
}
let lst=[1,2,3]
cce(...lst) // 将列表拆分赋值
箭头函数
function cce() {
console.log(1);
}
// 等效
let foo = () => console.log(1);
cce() // 1
foo() // 1
// 参数
function cce(a, b) {
return a + b;
}
// 等效
let foo = (a, b) => a + b;
console.log(cce(1))
console.log(foo(1, 3))
// 多行，多行函数体，需要以大括号来区分，并且需要return
function cce(a, b) {
let c = 1;
return a + b + c;
}
// 等效
let foo = (a, b) => {
let c = 1;
return a + b + c;
};
console.log(cce(1, 3))
console.log(foo(1, 3))
// 匿名函数
let c1 = [1, 2, 3, 4];
c1.forEach(function(element,index) {
console.log(index, element);
});
// 等效
let c2 = [1, 2, 3, 4];
c2.forEach((element,index)=>{
console.log(index, element);
})
函数
var person = {
age: 18,
// 箭头函数形式
run: ()=>{
setTimeout(()=>{
// this 指向 window 对象
// 分析：箭头函数里的 this 不再由箭头函数的调用方式决定，而是由其外层函数决定，而这里的外层 run 函数也是箭头函数，所以由其外层函数决定
console.log(this);
}, 100)
},
// 匿名函数形式
travel: function() {
setTimeout(()=>{
// this 指向 person 对象
// 分析：匿名函数里的 this 由匿名函数的调用方式决定
console.log(this);
}, 100)
},
// ES6 对象方法的简写形式（推荐使用方式）
say() {
// this 指向 person 对象
console.log(this);
setTimeout(()=>{
// this 指向 person 对象
// 分析：箭头函数里的 this 由其外层函数决定
console.log(this);
}, 100)
}
}
免责声明:本站部份内容由优秀作者和原创用户编辑投稿，本站仅提供存储服务，不拥有所有权,不承担法律责任。若涉嫌侵权/违法的，请反馈，一经查实立刻删除内容。本文内容由快快网络小媛创作整理编辑！