web API学习笔记

call() 和apply() 作用: 可以改变this的指向

 function f1(x, y) {
        console.log(x+y, this)
    }

var obj = {
        age:10,
        sex:"男"
    }
    //f1.apply(obj, [10,20]);// 改变了f1的指向, 把f1的this指向到了obj
    f1.call(obj, 10,20);// 改变了f1的指向, 把f1的this指向到了obj

    function Person(name, sex) {
        this.name = name;
        this.sex = sex;
    }
    Person.prototype.eat = function () {
        console.log(this)
    }
    var per = new Person("小明", "女");
    per.eat()

    function Son(name, sex) {
        Person.call(this, name, sex)
    }

    var son = new Son("小小明", "男")
    console.log(son.name, son.sex)

    //把人吃方法的指向变成儿子的身上
    per.eat.call(son)

02.bind()方法

总结:
假如使用一个函数需要改变this指向值, 用call, apply, bind
fn.call(需要指向的对象, 参数1, 参数2…) 参数不多的时候用
fn.apply(需要指向的对象, [参数1, 参数2…]) 参数很多的时候用
假设你要生成一个新的函数, 并且想绑定在某个函数对象上使用, 就可以使用bind()
var newFn = fn.bind(需要指向的对象, 参数1, 参数2…)
调用 newFn();

作用域系列

   //全局变量
    // if(true){
    //     var num = 10
    // }
    // console.log(num);
    //
    // while (true){
    //     var num2 = 100;
    //     break;
    // }
    // console.log(num2);
    //
    // //局部变量
    // function f1() {
    //     var num3 = 1000;
    // }
    //console.log(num3)

    //作用域链--->变量的使用是从里到外搜索的,
   // var num = 10;
   //  function f1() {
   //      //var num = 100;
   //      function f2() {
   //         // var num = 1000;
   //          console.log(num)
   //      }
   //      f2()
   //  }
   //  f1();

    //变量的声明的提前
    console.log(num);
    var num = 10;

    //函数的声明提前了
    ff();
    function ff() {
        console.log("呵呵")
    }

    //函数的表达式
   // fff();
   var fff =  function() {
        console.log("呵呵")
    }

闭包

闭包的概念: 函数a中, 有一个函数b, 而这个函数b中可以访问函数a中的变量,此时就形成了闭包即 闭包就是能够读取其他函数内部的变量
闭包就是函数内部和函数外部链接起来的桥梁
闭包的作用: 缓存数据, 延长作用域链
闭包的优点: 缓存数据,  也是缺点
    // function f1() {
    //     var num = 100;
    //     function f2() {
    //         console.log(num);
    //     }
    //     f2()
    // }
    // f1();

    function f1() {
        var num = 100;
        num++;
        return num;
    }

    var ff = f1()
    console.log(ff);//101
    console.log(ff);//101
    console.log(ff);//101

    function f2() {
        var num = 100;
        return function () {
            num++;
            return num;
        }
    }
    var fff = f2();
    console.log(fff());// 101
    console.log(fff());// 102
    console.log(fff());// 103

沙箱

    //沙箱: 虚拟环境. 小黑盒子.在虚拟的环境中模拟真实的世界, 去做实验, 实验结果和真实世界是一样的, 但是不会影响真实世界


    //  ---> 这就是沙箱--->小环境
    ((function () {
        var num = 10;
    })());

    var num = 100;// 不会互相影响