js self = this的解释
Demo 1:
function Person(){
this.name = 'hjzgg';
this.age = 24;
this.show = function(){
alert(name + " " + age);
}
}
var p = new Person();
p.show();
错误:name 和 age都没有定义。
Demo 2:
function Person(){
this.name = 'hjzgg';
this.age = 24;
this.show = function(){
alert(this.name + " " + this.age);
}
}
var p = new Person();
p.show();
正确。
Demo 3:
function Person(){
this.name = 'hjzgg';
this.age = 24;
this.show = function(){
alert(this.name + " " + this.age);
}
}
var p = new Person();
p.show.call({});
错误:name 和 age 未定义。
Demo 4:
function Person(){
this.name = 'hjzgg';
this.age = 24;
var self = this;
this.show = function(){
alert(self.name + " " + self.age);
}
}
var p = new Person();
p.show.call({});
通过 var self = this,正确。
Demo 5:
function Person(){
this.sayHello = function(){
alert('hello world!');
}
this.show = function(){
sayHello();
}
}
var p = new Person();
p.show();
错误:sayHello未定义。
Demo 6:
function Person(){
var sayHello = function(){
alert('hello world!');
}
this.show = function(){
sayHello();
}
}
var p = new Person();
p.show();
正确。
结论:
每个函数都有属于自己的this对象,这个this对象是在运行时基于函数的执行环境绑定的,即在全局对象中,this指向的是window对象;在自定义函数中,this对象指向的是调用这个函数的对象,也就是说,this指向的是调用执行环境的那个对象。如果是在函数嵌套环境中,this指代的是调用外部函数或者内部函数的执行环境的对象。
那么这里可能又会出现新的疑问:为什么self.name 和 self.age是正确的呢?
其实这又涉及到另一个话题:实例成员与局部成员。我们创建构造函数的意义就是要用它来创建实例,那么所有属于实例的成员都需要用this来定义;而只有那些不属于实例的成员才不会用this定义;当然,用this定义了方法以后,在函数作用域内部要调用此方法时,就需要加上this了。
Demo 7:
var person = {
name : 'hjzgg',
age : 24,
show : function(){
alert(name + " " + age);
}
}
person.show();
错误:name 和 age未定义。
Demo 8:
var person = {
name : 'hjzgg',
age : 24,
show : function(){
alert(this.name + " " + this.age);
}
}
person.show();
正确。
Demo 9:
var person = {
name : 'hjzgg',
age : 24,
show : function(){
alert(this.name + " " + this.age);
}
}
person.show.call({});
错误:name 和 age 未定义。
Demo 10:
var person = {
name : 'hjzgg',
age : 24,
show : function(){
alert(person.name + " " + person.age);
}
}
person.show.call({});
正确。
js self = this的解释的更多相关文章
- Js apply 方法 具体解释
Js apply方法具体解释 我在一開始看到javascript的函数apply和call时,很的模糊,看也看不懂,近期在网上看到一些文章对apply方法和call的一些演示样例,总算是看的有点眉目了 ...
- js 调用 oc 的解释
JavaScriptCore NSInvocation js解释器在解释函数调用时,会在执行环境进行函数搜索,主调者类型判定: 如果是js调用,直接解释执行: 如果是oc调用,则将调用打包成NSInv ...
- js中Prototype属性解释及常用方法
1.prototype的定义 javascript中的每个对象都有prototype属性,Javascript中对象的prototype属性的解释是:返回对象类型原型的引用. 每一个构造函数都有一个属 ...
- node.js基本概念简单解释
1:什么是回调函数? 2:什么是同步异步 3:什么是I/O 4:什么是单线程/多线程 5:什么是阻塞/非阻塞 6:什么是事件 7:什么是事件驱动 8:什么是事件驱动的回调 9:什么是事件循环 解释: ...
- js中的预解释
在js中,带var 和function关键字的需要预解释: 那什么是预解释?就是在js代码执行之前,先申明好带有var 关键字和带有function关键字的变量,在内存里先安排好.但是带有var关键字 ...
- js的Prototype属性 解释及常用方法
函数:原型 每一个构造函数都有一个属性叫做原型(prototype,下面都不再翻译,使用其原文).这个属性非常有用:为一个特定类声明通用的变量或者函数. prototype的定义 你不需要显式地声明一 ...
- <!--[if IE]><script type="text/javascript" src="matrix/js/html5.js"></script><![endif]-->代码解释
块注释例子 1. <!--[if !IE]><!--> 除IE外都可识别 <!--<![endif]-->2. <!--[if IE]> 所有的I ...
- js跨域问题解释 使用jsonp或jQuery的解决方案
js跨域及解决方案 1.什么是跨域 我们经常会在页面上使用ajax请求访问其他服务器的数据,此时,客户端会出现跨域问题. 跨域问题是由于javascript语言安全限制中的同源策略造成的. 简单来说, ...
- vue.js权威指南----代码解释实例
1:P61(值绑定) <input type="checkbox" v-model="toggle" :true-value="a" ...
随机推荐
- Linux系统编程之IO_缓冲和非缓冲
下面是一段类似日志记录的代码,已获取通讯的报文内容和当时的环境参数内容,就是创建一个文件,使用标准IO的fopen.fprintf进行输出记录.但是在调试中,刚开始我就傻眼了,文件创建成功了,但是实时 ...
- xml.etree.ElementTree对CDATA的输出
xml.etree.ElmentTree不支持CDATA 的输出,但是支持Comment的输出.由于在项目中需要输出带有CDATA块的XML文本,参考Comment的做法,修改ElmentTree中的 ...
- sql server的优缺点
sql server的优点众多,让其在数据库领域独占鳌头,成为最受欢迎的数据库系统,其优缺点也自然是喜爱者们所关注的,首先了解一下它的历史: sql server是一个关系型数据库管理系统,最初是由M ...
- mac 之 jmeter下载、解压、启动
1:下载地址:http://jmeter.apache.org/download_jmeter.cgi 2:双击下载的zip文件,即可解压 3:打开终端,cd 到解压的目录下 例如:cd /User ...
- bootstrap之排版类
bootstrap之排版类
- 一个flex buider 3 在eclipse下不能编译的问题解决
今天处理一个遗留的项目:项目使用了flex作为界面,装好flex Builder 3 并添加插件到eclipse,eclipse使用3.7版本. 导入项目,编译,发现编译时候出现 Errors run ...
- Xamarin的不归路-生成安卓错误3
错误提示: 解决方案:升级jdk到8即可. 2016年9月1日14:50
- centos上安装php运行环境
可以参考,但我安装的过程不完全一样http://www.cnblogs.com/liulun/p/3535346.html 我先安装的apache,直接执行的yum -y install httpd ...
- SQL存储过程基础(从基础开始学,加油!)
Transact-SQL中的存储过程,非常类似于Java语言中的方法,它可以重复调用.当存储过程执行一次后,可以将语句缓存中,这样下次执行的时候直接使用缓存中的语句.这样就可以提高存储过程的性能. Ø ...
- 仿JQ基础架构,可扩展。
(function(win,doc,fn){ var events = [];//拷贝核心方法 var publicEvent = ["extend","f ...