es6学习-3

发表于 | 分类于

es6箭头函数
1.如果只有一个参数,()可以省略
2.如果只有一个return {}可以省略

1
let show = a => a * 2;

剩余参数 args是剩余参数
参数扩展：收集剩余参数 …args 这个必须是最后一个。
不仅用于收集参数，也可以用于展开数组。

1
2
3
function(a,b,...args){
    console.log(args);
}

展开运算符

1
2
3
4
5
6
7
8
let arr = [1,2,3];
show(a,b,c) => {
console.log(a);
console.log(b);
console.log(c);
}
//调用的时候
show(...arr);

既可以展开，调用。
解构赋值
1.左右两边结构必须相同
2.右边必须是一个东西
3.声明和赋值是不能分开的，不能let[a,b] 随后再[a,b] = 这种事不合法的

1
2
let [a,b,c] = [12,13,14];
let {a,b,c} = {a:12,b:13,c:14}; //对象对应的值必须是相同的。a 对应字典里的a,b对应字典里的b，c对应字典里的c.

字符串的模板语法

1
2
3
4
5
var p = 12;
let str2 = `<div>
${p}
</div>`;
console.log(str2);

用来套进去，可以用$符号将外部的值传入嵌进去。可以多次换行。

类的使用 class关键字，专门的构造器 constructor

1
2
3
4
5
6
7
8
9
10
class User{
    constructor(name,pass){
        this.name = name;
        this.pass = pass; //属性的定义
    }
    //函数的定义
    showName(){
        alert(this.name);
    }
}

类中继承的作用
原先的继承

1
2
3
4
5
6
7
8
9
function VipUser(name,pass,level){
    User.call(this,name,pass);
    this.level = level;
}
VipUser.prototype = new User();
VipUser.prototype.constructor = VipUser;
VipUser.prototype.showLevel = function() {
    alert(this.level);
}

通过prototype的方法进行改变等。指定原型，随后指定自己的等。
es6中的方法

1
2
3
4
5
6
7
8
9
10
class VipUser extends User{
    constructor(name,pass,level){
       super(name,pass); //父级的 超类
       this.level = level;
    }
    //方法
    showLevel(){
        alert(this.level);
    }
}

json拼接到url字符串

1
2
let json = {a:12,b:5};
let str = "www.baidu.com" +

json的标准写法
json中的key必须用”“包起来，若是没有包起来就是js对象

1
{a:12,b:5}

这是js对象

1
{"a":12,"b":5}

这才是json对象。 而且不能用单引号。
json的简写：注意 以下说的都是对象的简写。而不是json

1
2
3
4
let a = 12;
let b = 5;
let json = {a,b,c:55};
console.log(json);

函数的简写 function可以去掉，直接加括号

1
2
3
4
5
var a = {
    show(){
        console.log(223);
    }
};

promise的使用 all必须全部成功
promise中的all方法，当全部promise执行完毕，并且成功返回的时候，才执行then方法

1
2
3
4
5
promise.all([
    p1,p2
]).then(function(object){
let [res1,res2] = object; //解析构值
})

promise中的race主要其中有一个返回就可以，不用管其中所有成功。
yield 可以让函数暂时停止在某个地方 等到next再进行下面的调用。

1
2
3
4
5
6
//generator函数
function *show(){
//代码1
yield ajax(xxx)； //中间能够停
//代码2
}

同generator函数生成了许多小函数。 next进行下一步。yield是停止暂停。

1
2
3
let obj = show();
obj.next();
obj.next();

generator可以向内部传参数

1
2
3
4
5
6
7
8
9
function *show() {
    alert("a");
  let a =  yield ; //yield还能返回东西
    alert(a);
    return a;
};
let gen = show();
gen.next(12); //对于传参来说是费的 这里的next执行的是从show到第一个yield之间的代码
gen.next(5);

如上所示 gen.next(12)这个可以说是无用的，因为第一步的参数是要用过show()方法的直接调用传入的。
后续gen.next(5)表示向yield的第二个代码块传入了参数5 所以可以通过let a = yield 获取到5 并进行接下来的操作

generator也可返回值。

1
2
3
4
5
6
7
8
9
10
11
12
 function *show() {
      alert("a");
      //半路返回
      yield 12;
      alert("b");
      //最后一道靠return完成
      return 16;
  }
  let gen = show();
  let res1 = gen.next(); //返回的是一个json对象{value:12,done:false} 表示没有做完
  let res2 = gen.next(); //返回的是undefined done是true
console.log(res2);

yield 12 表示从函数开始到第一个代码块返回的是12，通过打印res1可以知道，还没有做完，当前取得的值时12
第二个res2拿到的是undefined,done为true,表示已经完成。最后的返回只能通过return返回，此时表示已经完成。
promise涉及到逻辑操作的时候，与普通回调的嵌套并没有什么差别。
所以用generator更适合。当第一个完成后，再执行逻辑，执行第二个。
js由ecmscript,dom,和bom组成。
string,number,undefined,boolean,null.
基本数据类型放在栈区，复杂数据类型放在堆区。堆区存储量大。
es6汇总
1.变量
var 重复声明，函数级别。
let 不能重复声明。块级变量。
const 不能重复声明，块级常量。
2.箭头函数
1.方便 如果只有一个参数，()可以省略。
2.如果只有一个return,{}也可以省。
3.修正this问题。
this相对正常点。
3.参数扩展
…
收集或者扩展。

1
2
3
默认参数function(a,b = 5){

}

4.数组方法
map映射,reduce汇总 一堆,filter 过滤(删选)forEach循环.
5.字符串
startWith/endWith
字符串模板 换行。$(a)xxx$(b)
6.promise方法
对数据分钟
promise.all
7.generator执行到一半可以暂停。
8.json对象。stringfy,parse.
9.解构赋值
左右结构一样
右边是个合法东西
声明和赋值一次性完成。

1
let [a,b,c] = [12,5,8];

10.面向对象

1
2
3
4
5
6
class Text{
    constructor(){
        this.xxx = 
    }
}
class class2 exnteds Text