首先感谢简书的es6说明的作者
ES6常用的功能及方法：
1.let、const
# 这两个东东的用处与var有点类似，只是它们只是作用于一个{}块中。
# 其次let是定义变量，而const是定义常量，即let定义的东西可以在{}块中更改，但const不行。
# demo 如下：
function getes6(){
let a = "hello!"
const b = "world!"
return a
};
let c = getes6();
let a = 'es6';
# let常用的情况
for(let i = 0;i < 5;i++){
console.log(i)
}
2.class, extends, super,promise
# 上面代码首先用class定义了一个“类”，可以看到里面有一个constructor方法，这就是构造方法，而this关键字则代表实例对象。简单地说，constructor内定义的方法和属性是实例对象自己的，而constructor外定义的方法和属性则是所有实力对象可以共享的。
# Class之间可以通过extends关键字实现继承，这比ES5的通过修改原型链实现继承，要清晰和方便很多。上面定义了一个Cat类，该类通过extends关键字，继承了Animal类的所有属性和方法。
# super关键字，这个类似python中的super。它指代父类的实例（即父类的this对象）。子类必须在constructor方法中调用super方法，否则新建实例时会报错。这是因为子类没有自己的this对象，而是继承父类的this对象，然后对其进行加工。如果不调用super方法，子类就得不到this对象。
class Animal {
constructor(){
this.type = 'animal'
}
says(say){
console.log(this.type + ' says ' + say)
}
}
let animal = new Animal()
animal.says('hello') //animal says hello
class Cat extends Animal {
constructor(){
super()
this.type = 'cat'
}
}
let cat = new Cat()
cat.says('hello') //cat says hello
输出： animal says hello
输出： cat says hello
#相信凡是写过javascript的童鞋也一定都写过回调方法（callback），简单说回调方法就是将一个方法func2作为参数传入另一个方法func1中，当func1执行到某一步或者满足某种条件的时候才执行传入的参数func2。
如下的例子：
function func1(a, func2) {
if (a > 10 && typeof func2 == 'function') {
func2()
}
}
func1(11, function() {
console.log('this is a callback')
})
# 输出：
this is a callback
3.箭头函数
箭头函数是ES6中特有的骚操作：
# 首先是最简单的箭头函数：
var one = () => 1;
# 以上等于：
function one(){
return 1;
}
# 调用的办法：
console.log(one())
# 输出：
1
# 两个参数的情况：
var two = (x, y) => {x++; y--; return x+y};
# 以上等于：
function two(x,y){
x++;
y--;
return x+y
}
# 调用的方法：
console.log(two(11,22))
# 输出：
33
# 接下来是箭头函数的this：
class Animal {
constructor(){
this.type = 'animal'
}
says(say){
setTimeout( () => {
console.log(this.type + ' says ' + say)
}, 1000)
}
}
# 调用：
var animal = new Animal()
animal.says('hi')
# 输出：
animal says hi
4.template string(字符串模板)
var name2 = 'twy';
console.log(`this ${name2}`) # 注意这里的是`(上漂)不是'(单引号)
# 输出：
this twy
# 字符串模板最常用的场景：
$("#result").append(`
There are <b>${basket.count}</b> items
in your basket, <em>${basket.onSale}</em>
are on sale!`);
# 若不使用字符串模板的情况：
$("#result").append('There are <b>'+basket.count+'</b> items
in your basket, <em>'+basket.onSale+'</em>
are on sale!')
# 字符串模板所包含的一些常用操作：
# 1.includes：判断是否包含然后直接返回布尔值
let str = 'hahay'
console.log(str.includes('y')) // true
# 2.repeat: 获取字符串重复n次
let s = 'he'
console.log(s.repeat(3)) // 'hehehe'
5.destructuring(解构)
# demo1:
var cat = 'tty';
var dog = 'yyt';
var zoo = {cat,dog};
console.log(zoo);
# 输出:
{cat: "tty", dog: "yyt"}
# demo2:
# 对象
const people = {
name: 'lux',
age: 20
}
const { name, age } = people
console.log(`${name} --- ${age}`)
# 输出：
lux---20
# demo3:
# 数组
const color = ['red', 'blue']
const [first, second] = color
console.log(first) //'red'
console.log(second) //'blue'
# 输出：
red
blue
6.default, rest
default主要用在函数里面，代表一个默认值：
# 若不使用default的情况：
function animal(type){
type = type || 'cat'
console.log(type)
}
animal()
# 输出：
cat
# 使用default的情况：
function animal(type = 'cat'){
console.log(type)
}
animal()
# 输出同上
# rest用于获取函数多余参数，将多余参数放入数组中。
function animals(...types){
console.log(types)
}
animals('cat', 'dog', 'fish')
# 输出：
["cat", "dog", "fish"]
7.for-of循环(注意与for-in的区别！！！)
# 首先来看看for-in:
var test = ['apple','orange','banana','pear'];
for(let i in test){
console.log(i)
}
# 输出：输出的内容为键值
0
1
2
3
# 再来看看for-of：
for(let n in test){
console.log(n)
}
# 输出：输出的内容为具体的值：
apple
orange
banana
pear
# 注意：for-of不能循环json ！！！
for(var [key,value] of test.entries()){
console.log(key,value);
}
# 输出：输出的内容为键和值：
0 apple
1 orange
2 banana
3 pear
promise对象和async关键字对比
var a = async function (){
return "Hello"
}
a() // 输出：Promise {<resolved>: "hello"}
var a = function (){
return new Promise(resolve => {
resolve("hello")
})
}
a() // 输出：Promise {<resolved>: "hello"}
... 在es6的作用
es6中新增的语法...
用处一：function中使用作为剩余参数的用法
function a(...rest){
for(let i of rest){
console.log(i)
}
}
a(2,3,4,5,6)
输出：
2
3
4
5
6
... 还有一个用处，可以作为迭代的对象遍历：
var a = [1,2,3,4,5,6]
var b = [...a]
console.log(b)
输出：
[1,2,3,4,5,6]
var a = [1,2,3,4,5,6]
var b = [11,22]
var c = [...a,...b]
console.log(c)
输出：
[1,2,3,4,5,6,11,22]
JS中在一个json中使用变量作为key：
Es6中新增的解构语法允许在json中使用变量作为key，方法如下：
var a = 'hello'
var b = {[a]:'world'} // b={hello:'world'}
JS中的柯里化
let a = function(x) {
return function(y) {
return x+y
}
}
a(3)(4)
// 输出：7
网友评论