关于js里的this关键字的理解(3)

view plaincopy to clipboardprint? function JSClass() { var varText = "func variable!"; //函数中的普通变量 this.m_Text = 'func member!'; //函数类的成员变量 this.m_Element = document.createElement('DIV'); //成员变量,创建一个div对象 this.m_Element.innerHTML = varText; //使用函数的普通变量 this.m_Element.attachEvent('onclick', this.ToString); //给这个对象的事件连上处理函数 this.newElement = document.createElement('DIV'); this.newElement.innerHTML = "new element"; this.newElement.m_Text = "new element text!"; //给创建的对象建个成员 this.newElement.onclick = function() { alert(this.m_Text); //指向div对象的成员 }; } JSClass.prototype.Render = function() { document.body.appendChild(this.m_Element); //把div对象挂在窗口上 document.body.appendChild(this.newElement); } JSClass.prototype.ToString = function() { alert(this.m_Text); //指向窗口(window)对象 }; function initialize(){ var jc = new JSClass(); jc.Render(); jc.ToString(); //里面的this指向JSClass类的实例,里面有m_Text成员 } // --> initialize(); // --> function JSClass() { var varText = "func variable!"; //函数中的普通变量 this.m_Text = 'func member!'; //函数类的成员变量 this.m_Element = document.createElement('DIV'); //成员变量,创建一个div对象 this.m_Element.innerHTML = varText; //使用函数的普通变量 this.m_Element.attachEvent('onclick', this.ToString); //给这个对象的事件连上处理函数 this.newElement = document.createElement('DIV'); this.newElement.innerHTML = "new element"; this.newElement.m_Text = "new element text!"; //给创建的对象建个成员 this.newElement.onclick = function() { alert(this.m_Text); //指向div对象的成员 }; } JSClass.prototype.Render = function() { document.body.appendChild(this.m_Element); //把div对象挂在窗口上 document.body.appendChild(this.newElement); } JSClass.prototype.ToString = function() { alert(this.m_Text); //指向窗口(window)对象 }; function initialize(){ var jc = new JSClass(); jc.Render(); jc.ToString(); //里面的this指向JSClass类的实例,里面有m_Text成员 } // --> initialize(); // -->

上面的代码执行结果是:

页面加载时,弹出对话框,输出func member!

页面上显示

func variable! new element

单击func variable时,弹出对话框,显示undefined

——因为这时toString函数里的this指针指向window

单击new element时,弹出对话框显示new element text!

——因为这时toString函数里的this指针指向div元素,而该元素已经定义了m_Text成员(this.newElement.m_Text = "new element text!")

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wggszg.html