解构
ES6允许按照一定模式从数组和对象中提取值,对变量进行复制,这被称为解构赋值
1.数组的解构
const F4 = ['11','22','33','44']
let [xiao,liu,zhao,song] = F4
console.log(xiao) //11
console.log(liu) //22
console.log(zhao) //33
console.log(song) //44
2.对象的解构
const zhao = {
name:'赵本山',
age:'不详',
xiaopin:function(){
console.log('我可以演小品')
}
}
let {name,age,xiaopin} = zhao
模板字符串
- ES6引入新的声明字符串的方式``` `
1.声明
let str = `我也是字符串`
console.log(str,typeof str)
//我也是字符串 String
2.内容中可以直接出现换行符
let str = '<ul><li>1</li><li>2</li><li>3</li></ul>' //无法换行
let str = `<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>`
3.变量拼接
let lovest = '魏翔'
let out = `${lovest}是我心目中最搞笑的演员`
console.log(out) //魏翔是我心目中最搞笑的演员
对象的简化方法
ES6允许在大括号里面,直接写入变量和函数,作为对象的属性和方法。
这样的书写更加简洁
let name = '尚硅谷'
let change = function(){
console.log('我们可以改变')
}
const school = {
name,
change,
improve(){
console.log("我们可以提升你的技能")
}
}
箭头函数以及声明特点
ES6允许使用箭头(=>)定义函数
声明一个函数
let fn = function(){
}
let fn = (a,b)=>{
return a+b
}
//调用函数
let result = fn(1,2)
console.log(result) //3
1.this是静态的,this始终指向函数声明时所在作用域下的this的值
function getName(){
console.log(this.name)
}
let getName2 = () =>{
console.log(this.name)
}
//设置window对象的name属性
window.name = '尚硅谷'
const school = {
name:'ATGUIGU'
}
//直接调用
getName(); 尚硅谷
getName2(); 尚硅谷
//call方法调用
getName.call(school) //ATGUIGU
getName2.call(school) //尚硅谷
2.不能作为构造实例化对象
let Person = (name,age) =>{
this.name = name
this.age = age
}
let me = New Person('xiao',30);
console.log(me) //报错
3.不能使用arguments变量
let fn = ()=>{
console.log(arguements)
}
fn(1,2,3) //报错
4.箭头函数的简写
省略小括号,当形参有且只有一个的时候
let add = n =>{ return n+n } console.log(add(9)) //18
省略花括号,当代码体只有一条语句的时候,此时return必须省略
而且语句的执行结果就是函数的返回值
let pow = (n)=> n *n console.log(pow(9)) //81