javascript学习笔记（2）————this

//简单的学习JavaScript中this关键词
//this在于我简单的理解就是谁调用了当前方法（函数），this就指向谁

var a = 20;
function fn1(){
    this.a = 10;
}

fn1();                 //其实这里隐含了window对象 window.fn1() === fn1()
alert(this.a);         //10;
alert(window.a);    //10;

alert(fn1.a);        //undefined 
                    //这里出现undefined，是因为fn1函数并没有自己调用a.
var fn1 = new fn1();
alert(fn1.a);         //10; 使用new关键字 js内部大概经历： 1）建立一个空对象 2）this关键字指向空对象 3）空对象赋值给fn1
                    //所以出现this就指向fn1的情况

//初学的时候很容易犯这样的错误

var oBox = document.getElementById('bob');
oBox.onclick = function(){
    this.style.backgroundColor = 'red'; //这里this指向oBox
    function abc(){
        this.style.display = 'block';    //这里this暂时不清楚指向谁，因为还没有被调用
    }
    abc();//刚开始的很容易犯迷糊，以为这里oBox的模型是块模型
          //其实这里发生的window.style.display = 'block';
          //因为其实window调用的。其实有个很简单的方式，因为 abc()前面就没有oBox.而是隐藏的window
}


//下面在对象下的调用
var color = 'black';

var obj = {
    color :'blue'，
    saycolor : sayColor
}

var obj2 = {
    color :'red',
    saycolor : sayColor
}

function sayColor(){
    console.log(this.color);
}

sayColor(); //'black';
obj.saycolor();//'blue';
obj2.saycolor();//'red'