es6中generator函数和类

generator函数

generator函数的声明

    function* fn() {
        console.log('generator函数');
        yield '1'
        console.log('generator函数');
        yield '2'
        console.log('generator函数');
    }

generator函数的调用

generator函数的调用 返回一个iterator对象，对象里面有一个next()方法，返回一个对象，里面有value和done，value代表yield后面的值。

     function* fn() {
        console.log('generator函数');
        yield '1'
        console.log('generator函数');
        yield '2'
        console.log('generator函数');
    }
    var gen = fn()
    console.log(gen.next());
    console.log(gen.next());
    console.log(gen.next());

return和yield的区别

return:后面的不执行，代表函数执行完成
yield:后面的可以执行，通过调用next()继续执行。

next()方法

next()方法还可以接受一个参数，它的参数会作为上一个yield的返回值

    function* genEr() {
        console.log('1');
        let res = yield '第一'
        console.log(res);
        let rest = yield res
        yield rest
    }
    let genEt = genEr()
    console.log(genEt.next());
    console.log(genEt.next('参数'));//{value:'参数',done:false}
    console.log(genEt.next('参数1'));//{value:'参数1',done:false}

在generator函数中调用其他函数

想从其他函数调用另一个函数 用yield*

    function* fn_1() {
        console.log('fn_1');
    }
    function* fn_2() {
        console.log('fn_2');
    }
    function* fn_3() {
        yield* fn_1()
        yield* fn_2()
        console.log('fn_3');
    }
    var FN = fn_3()
    FN.next()

es6中类的用法

声明类

    class Animal {
        // constructor构造函数
        constructor(name, age, eat) {
            this.name = name
            this.age = age
            this.eat = function () {
                // 构造函数中this指向实例化对象
                console.log(this);
            }
        }
    }
    var am = new Animal('bcd', 4, function () { console.log('this'); })
    console.log(am);
    console.log(am.name);
    console.log(am.age);
    am.eat()

在类中自定义方法

自定义方法 自定义方法中this指向实例化对象

     class Animal {
        // constructor构造函数
        constructor(name, age, eat) {
            this.name = name
            this.age = age
            this.eat = function () {
                // 构造函数中this指向实例化对象
                console.log(this);
            }
        }
        // 自定义方法 自定义方法中this指向实例化对象
        getName() {
            console.log(this);
        }
        setName(value) {
            // console.log(value);
            this.name = value
        }
    }
    var am = new Animal('bcd', 4, function () { console.log('this'); })
    console.log(am);
    console.log(am.name);
    console.log(am.age);
    am.eat()
    am.getName()
    am.setName('ls')
    console.log(am.name);

类中的静态方法

静态方法: static是关键字 静态方法中this 指向当前类，必须通过类调用

     class Animal {
        // constructor构造函数
        constructor(name, age, eat) {
            this.name = name
            this.age = age
            this.eat = function () {
                // 构造函数中this指向实例化对象
                console.log(this);
            }
        }
        // 自定义方法 自定义方法中this指向实例化对象
        getName() {
            console.log(this);
        }
        setName(value) {
            // console.log(value);
            this.name = value
        }

        // 静态方法: static是关键字 静态方法中this 指向当前类，必须通过类调用
        static getAge() {
            console.log(this);
        }
    }
    var am = new Animal('bcd', 4, function () { console.log('this'); })
    console.log(am);
    console.log(am.name);
    console.log(am.age);
    am.eat()
    am.getName()
    am.setName('ls')
    console.log(am.name);
    Animal.getAge()

类的继承

在es6中使用extends关键字来实现类的继承

    class Dog extends Animal {
        constructor(name, age, color) {
            // 继承关键字 super
            super(name, age)
            this.color = color
        }
        getNameDog() {
            super.getName
        }
    }
    var dog = new Dog('旺财', 6, 'black and white')
    console.log(dog);
    console.log(dog.name);
    dog.eat()
    dog.getNameDog()