js进阶1

<script>
    // map
    function run1() {
        let x = Array.from({
            length: 10
        }, (v, i) => i + 1);
        let res_x = x.map(String);
        console.info(res_x)
        console.info(x.map(x => x * x))
    }
    // reduce
    function run2() {
        let x = Array.from({
            length: 5
        }, (v, i) => i + 2);
        console.info(x)
        console.info(x.reduce((x, y) => x + y));
    }
    // filter
    function run3() {
        let arr = [1, 2, 3, 4, 5, 6, 7, 8]
        let res = arr.filter(x => x % 2 !== 0);
        console.info(res);

    }
    // sort
    // 幸运的是，sort()方法也是一个高阶函数，它还可以接收一个比较函数来实现自定义的排序。
    // 这是因为Array的sort()方法默认把所有元素先转换为String再排序，结果’10’排在了’2’的前面，因为字符’1’比字符’2’的ASCII码小。
    function run4() {
        let arr = [10, 20, 1, 2]
        arr.sort(function(x, y) {
            if (x < y) return -1;
            if (x > y) return 1;
            return 0
        });
        console.info(arr)

    }
    // arrow function 
    function run5() {
        // 两个参数:
        (x, y) => x * x + y * y

        // 无参数:
        // () => 3.14

        // 可变参数:
        //     (x, y, ...rest) => {
        //     var i, sum = x + y;
        //     for (i = 0; i < rest.length; i++) {
        //         sum += rest[i];
        //     }
        //     return sum;
        // }

        // ————————————————————————————————————————
        // 返回对象
        // x => ({ foo: x })
    }

    function run5_() {
        // var obj = {
        //     birth: 1990,
        //     getAge: function() {
        //         var b = this.birth; // 1990
        //         var fn = function() {
        //             return new Date().getFullYear() - this.birth; // this指向window或undefined
        //         };
        //         return fn();
        //     }
        // };

        // var ret = obj.getAge()
        // console.info(ret)
        // 上面的结果 NaN
        var obj = {
            birth: 1990,
            getAge: function() {
                var b = this.birth; // 1990
                var fn = () => new Date().getFullYear() - this.birth; // this指向obj对象
                return fn();
            }
        };
        var ret = obj.getAge();
        console.info(ret)
            // res:28
    }
    // class  constructor  extend  super    照抄python class思路即可 
    function run6() {
        class Student {
            constructor(name) {
                this.name = name;
            }

            hello() {
                console.info('Hello, ' + this.name + '!')
            }
        }
        var xiaoming = new Student('小明');
        xiaoming.hello();


        class PrimaryStudent extends Student {
            constructor(name, grade) {
                super(name); // 记得用super调用父类的构造方法!
                this.grade = grade;
            }

            myGrade() {
                console.info('I am at grade ' + this.grade)
            }
        }

    }
    // yield  next
    function run7() {
        function* fibonacci() {
            yield 1;
            yield 2;
            return 2;
        }

        var it = fibonacci();
        console.log(it); // "Generator {  }"
        console.log(it.next()); // 1
        console.log(it.next()); // 2
        console.log(it.next()); //undefined


        var itt = fibonacci();
        //而且Iterator的return的值不会被for...of循环到 ， 也不会被扩展符遍历到
        for (var per of itt) {
            console.info(per)
        }
        // res:
        // fibonacci {<suspended>}
        // {value: 1, done: false}
        // {value: 2, done: false}
        // {value: 2, done: true}
        // 1
        // 2
    }
    // yield
    function run7_() {

        function* foo() {
            yield 0;
            yield 1;
        }

        function* bar() {
            yield 'x';
            yield* foo();
            yield 'y';
        }
        for (let v of bar()) {
            console.log(v);
        };
        //res
        // x
        // 0
        // 1
        // y




    }
    // for ... of/in

    // 区分 for in    for  of
    // a.for  in  便历出来的是属性
    // b.for of 遍历的是value 
    // c.手动给对象添加属性后,for in 是可以将新添加的属性遍历出来  但是for of 不行，
    // d. for  in 的属性是使用[]  不可以使用 "."  
    function run8() {
        var a = ['A', 'B', 'C'];
        var s = new Set(['A', 'B', 'C']);
        var m = new Map([
            [1, 'x'],
            [2, 'y'],
            [3, 'z']
        ]);
        for (var x of a) { // 遍历Array
            console.log(x);
        }
        for (var x of s) { // 遍历Set
            console.log(x);
        }
        for (var x of m) { // 遍历Map
            console.log(x[0] + '=' + x[1]);
        }


    }
    //set
    // Set和Map类似，也是一组key的集合，但不存储value。由于key不能重复，所以，在Set中，没有重复的key。
    function run9() {
        var s = new Set();
        s.add(4);
        s.add(5);
        console.info(s)

        s.delete(4)
        console.info(s)
            // res
            // Set(2) {4, 5}
            // Set(1) {5}
    }
    //foreach
    function run10() {
        // forEach()
        function run1() {
            var x = [1, 2, 3, 4, 5, 7, 8, 9];
            x.forEach(function(each) {
                console.log(each);
            });
        }
        run1()
    }
    run10()
</script>