美文网首页
this对象的小魔术

this对象的小魔术

作者: Candy程 | 来源:发表于2017-04-13 09:47 被阅读0次

    分析以下几种情况下的程序输出值产生的原因:

    程序1.
    function obj(name){
        if(name){
            this.name = name
        }
        return this
    }
    obj.prototype.name = "name2"
    var a = obj("name1")
    var b = new obj 
    console.log(a.name)  // 'name1'
    console.log(b.name) // 'name2'
    name = 'name3'
    console.log(a.name) // 'name3'
    console.log(b.name) // 'name2'
    

    输出分析:

    obj.prototype.name = "name2"
    var a = obj('name1') ;
     /*直接调用obj函数
      *1. this -> window
      *2. 创建全局变量name,并赋值为'name1'
      *3. a -> window
    */
    var b = new obj
     a.name // window.name = 'name1'
     b.name // 对象实例本身不存在属性name,返回原型对象上的name属性值'name2'
    name = 'name3'  // 全局变量name被重赋值为'name3'
    a.name // window.name = 'name3' 
    b.name // 'name2'
    
    程序2
    function obj(name){
       if (name) {
          var obj = {}
          obj.name = name
          return obj
       }
    }
    obj.prototype.name = "name2"
    var a = obj("name1")
    var b = new obj
    console.log(a.name)  // 'name1'
    console.log(b.name // 'name2'
    console.log(name) //undefined
    name = 'name3'
    console.log(a.name) // 'name1'
    console.log(b.name) // 'name2'
    console.log(name) // 'name3'
    

    输出分析:

    obj.prototype.name = "name2"
    var a = obj('name1') ;
     /*直接调用obj函数
      *1. 创建对象obj
      *2. obj.name = 'name1'
      *3. a -> obj
    */
     var b = new obj
     a.name // obj.name = 'name1'
     b.name // 对象实例本身不存在属性name,返回原型对象上的name属性值'name2'
     name // 创建全局变量
     name = 'name3'  //window.name = 'name3'
     a.name //obj.name = 'name1' 
     b.name // 'name2'
    
    程序3
    var x = 'a'
    function printX() {
      console.log(x) // undefined
      var x = 'b'
      console.log(x) // 'b'
    }
    printX()
    var y = 'c'
    function printY() {
      console.log(y) // 'c'
      y = 'd'
      console.log(y) //'d'
    }
    printY()
    
    输出分析:
    //声明提升
    var x = 'a'
    function printX() {
      var x
      console.log(x) // undefined
      x = 'b'
      console.log(x) // 'b'
    }
    
    程序4
     function foo(a){
         var a;
         return a;
     }
     function bar(a){
        var a = 'bye';
        return a;
     }
     [foo('hello'),bar('hello')] // ['hello','bye']
    
    输出分析:
    // 解析foo('hello')执行过程:
     function foo(){
         var a
         var a
         a = hello
         return a
     }
    
    // 解析bar('hello')执行过程:
     function bar(){
        var a
        var a
        a = "hello"
        a = 'bye'
        return a
     }
    

    相关文章

      网友评论

          本文标题:this对象的小魔术

          本文链接:https://www.haomeiwen.com/subject/lmavattx.html