zoukankan      html  css  js  c++  java
  • 一种简易的方式阐述JavaScript中this的用法

    1. this用法实例

    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所在函数被调用时的当前作用域。
    一段实例代码立刻明白:

    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)情况:

    <input type="button" id="aButton" value="demo" onclick="demo()" />
    <script type="text/javascript">
    function demo() {
        this.value = Math.random();
    }
    </script>

    点击这个button之后,你会发现按钮的value值没有改变。
    原因:在本代码运行的情况下this指向的是window对象。

    <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)原因解释:

    <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();
    }
    <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();
    }

    4. 参考学习资料(1)JavaScript for Web Developers,Third Edition,Nicholas C. Zakas

    (2)http://www.cnblogs.com/ruxpinsp1/archive/2008/04/20/1162463.html

  • 相关阅读:
    SharedPreferences
    SQLiteOpenHelper
    JavaScript常用对象的方法和属性
    sublime 中文乱码
    windows 7 右下角登陆信息去除
    第七篇T语言实例开发,文本与程序的几种打开方法(版5.3)
    第六篇T语言实例开发,多点找色应用
    第五篇T语言实例开发,数组空间使用
    PHP实例开发(3)PHP中MVC学习之ThinkPHP
    第五篇T语言实例开发,百变字符(版本5.0)
  • 原文地址:https://www.cnblogs.com/jobs2/p/2708521.html
Copyright © 2011-2022 走看看