javaScpipt初理解4

一.作用域和闭包

作用域：全局.函数.块
1.作用于全局的默认的不可删除

  let user = {
            name: 1
        }
        console.log(user)
        //Object { name: 1 }  name: 1
               console.log(window.user)//undefined

2.函数作用域

 let user = 1

        console.log(user)//1 } 1
        console.log(window.user)//undefined
        //let声明的对象不属于顶层属性
        function getuser() {
            //私有变量
            let user1 =
                2

            //user是声明在函数外面的全局变量
            //可以在函数内使用
            return ` ${user}, ${user1};`

        }
        console.log(getuser());
      // 1,2

3.块作用域

  console.log(getuser());
        {
            let a = 1;
            let b = 2;
            console.log(a, b);//1,2

        }
        console.log(a, b );//not defined

4.闭包

let c = 1;
        function add(a, b) {
            return a + b + c
        }
        //c变量的访问就是闭包add访问了自由变量c
        console.log(add(2, 3)); //6

 function add() {
            let c = 3
            return function add1() {
                return c
            }
        }
        let f = add()
        console.log(f()); //3
        console.log(add()());//3

二.循环

1.while：入口判断

let arr = [1, 2, 3];
        console.log(arr);
        // 循环变量的初始化
        i = 0;
        while (i < arr.length) {
            console.log(arr[i]);
            //要有条件更新不然会进入死循环
            i++
        }

2.do while出口判断

do {
            i = 5
            console.log(arr[i]);//undefined
            i++ //记得条件更新
            console.log(`被执行了一次`);//被执行一次
        }
        while (i < arr.length)

3.对象的遍历 for-in

 const lesson = {
            "my name": "javaScript编程"
            , score: 100
        }
        for (let key in lesson) {
            console.log(lesson[key]);
        }

4.for循环

 // while的简化版
for (let i = 0; i < arr.length; i++) {
            console.log(arr[i]);
        }

5.for-of
用于对数组的遍历，对象不能使用这个

for (let item of arr) {
            console.log(arr);
        }//Array(3) [ 1, 2, 3 ]

三.迭代器

       function myIterator(data) {
            // 迭代器中必须要有一个next();
            let i = 0;
            return {
                next() {
                    // done，表示遍历是否完成？
                    // value:当前正在遍历的数据
                    let done = i >= data.length;
                    //返回布尔值
                    let value = !done ? data[i++] : undefined;

                    return { done, value };

                }
            }
        }

        let iterator = myIterator(['html', 'css', 'js', 'php']);
        console.log(iterator.next());
        console.log(iterator.next());
        console.log(iterator.next());
        console.log(iterator.next());
        console.log(iterator.next());

四.构造函数和原型

  function User(name, email) {
            // 1.内部会自动创建一个this，指向新生成的对象
            this.name = name;
            this.email = email;
        }
        const user2 = new User('admin', 'admin@163.com');
        console.dir(user2);

        // user对象的原型属性永远指向它的构造函数的原型属性对象

五.类的对象和继承

js中没有类的概念，都是通过原型实现继承的。
通过构造函数插件对象的工程，叫“类的实例化”

 function User(name, email) {
            this.name = name;
            this.email = email;
            this.show = function () {
                return {
                    name: this.name,
                    email: this.email
                }
            }
        }
        //构造函数对象的原型对象上的成员，可以被所有实例共享
        const user1 = new User(1, 2);
        console.log(user1);
        //Object { name: 1, email: 2, show: show() }

class user2 {
            // 构造方法：初始化对象的
            constructor(name, email) {
                this.name = name;
                this.email = email
            }

            show() {
                // 非静态成员中的this表示的就是当前属性值
                return this;//mame,email
            }


            static fetch() {
                return this
                // 静态成员中的this表示的就是当前的类 }

            }
            static userName = '1111';
        }
        const user3 = new user2(`111`, `1232131`)
        console.log(user3);//Object { name: "111", email: "1232131" }
        console.log(user3.show());//Object { name: "111", email: "1232131" }
        //静态方法
        console.log(user2.userName);//1111
        console.log(user2.fetch());//class user2 { constructor(name, email) }

class Child extends User2 {
            constructor(name, email, gender) {
                // 第一步必须将父类的构造方法来重新执行]，否则this用不了
                super(name, email);
                // 第二步：给子类的新成员去初始化
                this.gender = gender;
            }
            //更新
            show() {
                return { name: this.name, email: this.email, gender: this.gender };

            }
        }

        const child = new Child("111", "4645646", "男");
        console.log(child.show());//111, "4645646, 男