Maison > interface Web > js tutoriel > 5分钟理解JavaScript中this用法

5分钟理解JavaScript中this用法

高洛峰
Libérer: 2016-11-26 14:27:26
original
1114 Les gens l'ont consulté

前言
关于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]
 
 
点击这个button之后,你会发现按钮的value值没有改变。
原因:在本代码运行的情况下this指向的是window对象。
[html]
 
 
点击这个button之后,程序可正常执行。
(2)原因解释:
[html] 
 
 
得到的输出是:  
function demo() { 
    this.value = Math.random(); 

[html]
 
  
得到的输出是:  
function onclick() { 
    demo(); 


Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal