JavaScript基础知识-this

简介: 关于JavaScript中this关键字的基础知识,通过比较其他编程语言如Python中的self参数来帮助读者理解。

作者:尹正杰
版权声明:原创作品,谢绝转载!否则将追究法律责任。

  后记:

    其实有过其他编程经验(比如C++,Java,Python等)的小伙伴可能很容易理解这个this。

    以Python为例,还记得为类定义各种普通方法(及未使用装饰器装饰的方法)吗,它们都会涉及一个动态绑定的第一参数self。其实JavaScript的原理和其类似。

一.JavaScript源代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>this</title>
    <script type="text/javascript">

        var name = "JavaScript";

        /**
         *  解析器在调用函数每次都会向函数内部传递进一个隐含的参数,这个隐含的参数就是this,this指向的是一个对象。
         *
         *  this对象(浏览器在渲染代码时由浏览器隐式传参)我们称为函数执行的上下文对象,根据函数的调用方式的不同,this会指向不同的对象。
         *      (1)以函数的形式调用时,this永远都是window;
         *      (2)以方法的形式调用时,this永远都是object;
         *
         */
        function sayHello(name,age){
            console.log("this = %s",this)
            // 一旦有this的存在,我们可以根据不同调用者返回不同的name属性哟~
            console.log("this.name = %s",this.name)
            console.log("I'm %s, and I'm %d years old.",name,age);
        }

        /**
         *  创建一个对象,我们封装上面的函数
         */
        var obj1 = {
            name:"尹正杰",
            sayHi:sayHello
        }

        var obj2 = {
            name:"Jason Yin",
            sayHi:sayHello
        }


        // 如下所示。根据函数的调用方式不同,this会指向不同的对象。
        sayHello("Python",25);
        obj1.sayHi("CentOS",18);
        obj2.sayHi("Ubuntu",20);

    </script>
</head>
<body>

</body>
</html>

二.浏览器打开以上代码渲染结果

目录
相关文章
N..
|
4月前
|
存储 JavaScript 前端开发
JavaScript基础知识
JavaScript基础知识
N..
39 1
|
4月前
|
JavaScript 前端开发
JavaScript进阶知识汇总~(一)
JavaScript进阶知识汇总~(一)
|
11月前
|
编解码 JavaScript 前端开发
JavaScript 01 入门基础
JavaScript 01 入门基础
29 1
|
3月前
|
存储 JavaScript 前端开发
Javascript基础知识
Javascript基础知识
31 1
|
4月前
|
机器学习/深度学习 算法 JavaScript
JavaScript算法【入门】
JavaScript算法【入门】
67 1
|
4月前
|
前端开发 JavaScript Java
JavaScript进阶知识汇总~(二)
JavaScript进阶知识汇总~(二)
|
9月前
|
存储 移动开发 JavaScript
javaScript入门基础
javaScript入门基础
67 0
|
JavaScript 前端开发 C++
JavaScript 基本知识2
JavaScript 基本知识
82 0
JavaScript 基本知识2
|
Web App开发 编解码 JavaScript
JavaScript入门基础
JavaScript入门基础
66 0
JavaScript入门基础
|
JavaScript 前端开发 Java
JavaScript 基本知识1
JavaScript 基本知识
80 0