5分钟理解JavaScript中this用法

前言
关于javascript中this的用法网络中已经有较多比较详尽的介绍，可以参考本文的参考学习资料和网络。本文结合网络收集整理，尝试以一种简易的方式阐述javascript中this的用法，希望对大家关于javascript中this用法的快速理解有所帮助。
正文
1. this用法实例
[javascript] 
window.color = “red”; 
var o = { color: “blue” }; 
function saycolor(){ 
    alert(this.color); 
} 
saycolor(); //”red” 
o.saycolor = saycolor; 
o.saycolor(); //”blue” 
2. this用法简易理解
this指向哪里：
this运行的环境（the context object），或者简单理解为：this所在函数被调用时的当前作用域。
一段实例代码立刻明白：
[javascript] 
var fun = function() { 
    console.log(this); 
} 
fun();// console: window，fun 的执行context为window，即this所在函数（fun()）被调用时的当前作用域为window。 
new fun();//console: fun，fun 的执行context为fun对象内，即this所在函数（fun()）被调用时的当前作用域为fun对象内。 
3. this用法的一个特殊情况
（1）情况：
[html]
<input type="button" id="abutton" value="demo" onclick="demo()" /> 
<script type="text/javascript"> 
function demo() { 
    this.value = math.random(); 
} 
</script> 
点击这个button之后，你会发现按钮的value值没有改变。
原因：在本代码运行的情况下this指向的是window对象。
[html]
<input type="button" id="abutton" value="demo" /> 
<script type="text/javascript"> 
var button = document.getelementbyid("abutton"); 
function demo() { 
    this.value = math.random(); 
} 
button.onclick= demo; 
</script> 
点击这个button之后，程序可正常执行。
（2）原因解释：
[html] 
<input type="button" id="abutton" value="demo" /> 
<script type="text/javascript"> 
var button = document.getelementbyid("abutton"); 
function demo() { 
    this.value = math.random(); 
} 
button.onclick= demo; 
alert(button.onclick); 
</script> 
得到的输出是：  
function demo() { 
    this.value = math.random(); 
} 

[html]
<input type="button" id="aButton" value="demo" onclick="demo()" /> 
<script type="text/javascript"> 
var button = document.getElementById("aButton"); 
function demo() { 
    this.value = Math.random(); 
} 
alert(button.onclick); 
</script>  
得到的输出是：  
function onclick() { 
    demo(); 
} 

PHP5学习对象教程

PHP5学习对象教程由美国人古曼兹、贝肯、瑞桑斯编著，简张桂翻译，电子工业出版社于2007年12月1日出版的关于PHP5应用程序的技术类图书。该书全面介绍了PHP 5中的新功能、编程方法及设计模式，还分析阐述了PHP 5中新的数据库连接处理、错误处理和XML处理等机制，帮助读者系统了解、熟练掌握和高效应用PHP。

291

查看详情