每个函数在定义被ECMAScript解析器解析时,都会创建两个特殊的变量:this和arguments,换句话说,每个函数都有属于自己的this对象,这个this对象是在运行时基于函数的执行环境绑定的,即在全局对象中,this指向的是window对象;在自定义函数中,this对象指向的是调用这个函数的对象,

也就是说,this指向的是调用执行环境的那个对象。

如果是在函数嵌套环境中,this指代的是调用外部函数或者内部函数的执行环境的对象;



(注意:可以通过使用call()或者apply()改变函数执行环境的情况下,this就会指向其他对象。)



看例子吧:

 /*----- 2014-2-10 这个例子是错误的 -----*/

function BaseType(name,age){

    //用一个变量保存当前函数执行环境中的this对象

    //这里可能会有疑问:为什么非得把this保存起来呢?这是因为,内部函数(比如本函数里面包含的两个匿名函数)

    //在搜索this变量时,只会搜索到属于它自己的this,而不会搜索到包含它的那个函数的this。

    //所以,为了在内部函数能使用外部函数的this对象,要给它赋值了一个名叫self的变量。

    var self=this;

    this.name=name;

    this.age=age;

    this.sayHello=function(){

        console.log("My name is "+this.name+", and i'm "+this.age+"years old.");

    }

    this.saySomething=function(){

           //此处用法有点欠妥,完全可以不用self,而用this

           //self.sayHello();

           //正确的做法是:

           return function () { self.sayHello(); }

           //通常用法:将上下文this缓存到一个变量中

           //以便在本函数作用域内包含另一个函数作用域的情况下可以继续使用此上下文对象this

           //如果省略var self=this; 这行,那么在嵌套函数作用域内就无法访问到本函数作用域的成员了。        


}

}

var b1=new BaseType("wede",30);

b1.saySomething(); //My name is wede, and i'm 30years old.



从结果来看,是预期的结果。

那么这里可能又会出现新的疑问:为什么在saySomething()方法中非要用self.sayHello()来调用呢,

直接sayHello()多好?

其实这又涉及到另一个话题:实例成员与局部成员。

我们创建构造函数的意义就是要用它来创建实例,那么所有属于实例的成员都需要用this来定义;

而只有那些不属于实例的成员才不会用this定义;

当然,用this定义了方法以后,在函数作用域内部要调用此方法时,就需要加上this了。



为了证明这一点,来看下面的代码:

function BaseType(name,age){

    var self=this;

    this.name=name;

    this.age=age;

    this.sayHello=function (){

        console.log("My name is "+this.name+", and i'm "+this.age+"years old.");

    }

    this.saySomething=function(){

        sayHello();

    }

}

var b1=new BaseType("wede",30);

b1.saySomething(); //ReferenceError: sayHello is not defined

结果显示:sayHello方法未定义。

就是说明,我们调用的其实是局部方法sayHello,而现在只有实例方法sayHello,所以会出现异常。



下面来改装下(注意加粗的部分):

function BaseType(name,age){

    var self=this;

    this.name=name;

    this.age=age;

    var sayHello=function (){

        console.log("My name is "+name+", and i'm "+age+"years old.");

    }


    this.saySomething=function(){

        sayHello();

    }

}

var b1=new BaseType("wede",30);

b1.saySomething();//My name is wede, and i'm 30years old.



可以看出,输出了预期的结果。

而这时候,我们把sayHello方法变成了一个局部方法(对于实例不可见),然后再在saySomething方法中调用就可以了。

js中var self=this的解释的更多相关文章

  1. js中var的有或无--重复声明和以后的声明

    js中var的有或无--重复声明和以后的声明 使用var语句多次声明一个变量不仅是合法的,而且也不会造成任何错误. 如果重复使用的一个声明有一个初始值,那么它担当的不过是一个赋值语句的角色. 如果重复 ...

  2. 浅谈JS中 var let const 变量声明

    浅谈JS中 var let const 变量声明 用var来声明变量会出现的问题: 1. 允许重复的变量声明:导致数据被覆盖 2. 变量提升:怪异的数据访问.闭包问题 3. 全局变量挂载到全局对象:全 ...

  3. 【前端开发】】js中var写和不写的区别

    js中var用与不用的区别 Javascript声明变量的时候,虽然用var关键字声明和不用关键字声明,很多时候运行并没有问题,但是这两种方式还是有区别的.可以正常运行的代码并不代表是合适的代码. v ...

  4. js中var,let,const理解

    var变量提升: 解释:在声明a之前输出a,因为a是使用var声明变量得到提升,解释为下句 var a: console.log(a) a = 1; var声明会提到最上面的位置,但是赋值的位置还是当 ...

  5. js中,var 修饰变量名和不修饰的区别

    js中 允许在定义变量的时候 不加var 修饰符.js会在当前作用域下寻找上下文是否定义了此变量, 如果没有找到则会为这个变量分配内存.当且将其视为window的成员. 也就是全局变量. 如果加了va ...

  6. js中var 笔记

    js中声明变量会用到Var; 1,var a;声明一个变量a,此时输出a,会显示undefined:因为此时的a未定义: 2, var a=0;和b=0;有什么区别呢? 当声明一个全局变量时,实际是定 ...

  7. js 中var that=this

    js中经常出现var that=this,为什么这么做? http://stackoverflow.com/questions/4886632/what-does-var-that-this-mean ...

  8. JS中var声明与function声明两种函数声明方式的区别

    JS中常见的两种函数声明(statement)方式有这两种: // 函数表达式(function expression) var h = function() { // h } // 函数声明(fun ...

  9. js中var

    js中声明一个变量的时候,建议要加上var.如果不加,除非你知道自己在干什么,否则哪天会吃亏哈哈. 不加var,js会认为你声明的是全局变量. 举个小例子. function test1(){ a = ...

随机推荐

  1. 跳过 centos部署 webpy的各种坑

    用centos部署webpy发现的各种坑: 1.python 版本: 2.中文编码: 3.web模块路径: 在命令行里输入python,能import web,但是网站错误报告一直报告没有找到web模 ...

  2. [CF442A] Borya and Hanabi (暴力bitmask)

    题目链接:http://codeforces.com/problemset/problem/442/A 题目大意:给你n张卡片,你知道这n张卡片都是什么,但是不知道他们的位置.你每次可以请求朋友指出一 ...

  3. Unsupported major.minor version 51.0解决办法

    问题: 之前使用的是高版本的myeclipse2015ci,然后换成了myeclipse10.5,之前的workspace的内容没有改变,结果工程都出现了感叹号,运行时提示 Unsupported m ...

  4. 在VS中添加lib的简单方法

    1.工程---属性---配置属性---VC++ Directories---General---Include Directories:加上头文件存放目录 2.VC中,切换到"解决方案视图& ...

  5. Ejabberd作为推送服务的优化手段

    AVOS Cloud目前还在用Ejabberd做Android的消息推送服务.当时选择Ejabberd,是因为Ejabberd是一个发展很长时间的XMPP实现,并且基于Erlang,设想能在我们自主研 ...

  6. MAGIC XPA最新版本Magic xpa 2.4c Release Notes

    New Features, Feature Enhancements and Behavior ChangesSubforms – Behavior Change for Unsupported Ta ...

  7. cmd执行mysql操作

    (以下已安装到本机的mysql为例) 登录mysql数据库,如果没有在环境变量配置path到mysql中的bin目录,需要手动进入该目录中 执行:mysql -u用户名 -p密码 (注意:只要进入了m ...

  8. mongoDB数据库和Spring MVC的整合

    之前一直用到的项目是Spring MVC+maven+mysql的,最近有些数据需要用到mongoDB数据库,现在做一些总结. 第一步:加载jar.maven配置 <!-- mongodb开始 ...

  9. oozie调用shell

    <!-- Licensed to the Apache Software Foundation (ASF) under one or more contributor license agree ...

  10. swift3.0 创建一个app引导页面

    swift毕竟不像是oc ,第三方的框架很多,更何况是3.0,自己动手写了个引导页面,看得上我代码的麻友可以拿去用 引导页面有三个部分构成,scrollview用语切换引导视图,pageControl ...