JavaScript对象中的this属性
this属性表示当前对象,如果在全局作用范围内使用this,则指代当前页面对象window;
如果在函数中使用this,则this指代什么是根据运行时此函数在什么对象上被调用。
我们还可以使用apply和call两个全局方法来改变函数中this的具体指向。
先看一个在全局作用范围内使用this的例子:
< script type="text/javascript">
console.log(this === window); // true
console.log(window.alert === this.alert); // true
console.log(this.parseInt("021", 10)); // 10
< /script>
函数中的this属性是在运行时决定的,而不是函数定义时,如下:
// 定义一个全局函数
function foo() {
console.log(this.fruit);
} // 定义一个全局变量,等价于window.fruit = "apple";
var fruit = "apple"; // 此时函数foo中this指向window对象
// 这种调用方式和window.foo();是完全等价的
foo(); // "apple" // 自定义一个对象,并将此对象的属性foo指向全局函数foo
var pack = {
fruit: "orange",
foo: foo
}; // 此时函数foo中this指向pack对象
pack.foo(); // "orange"
全局函数apply和call可以用来改变函数中this属性的指向,如下:
// 定义一个全局函数
function foo() {
console.log(this.fruit);
} // 定义一个全局变量
var fruit = "apple"; // 自定义一个对象
var pack = {
fruit: "orange"
}; // 等价于window.foo();
foo.apply(window); // "apple" // 此时foo中的this === pack
foo.apply(pack); // "orange"
注:apply和call两个函数的作用相同,唯一的区别是两个函数的参数定义不同。
因为在JavaScript中函数也是对象,所以我们可以看到如下有趣的例子:
// 定义一个全局函数
function foo() {
if (this === window) {
console.log("this is window.");
}
} // 函数foo也是对象,所以可以定义foo的属性boo为一个函数
foo.boo = function() {
if (this === foo) {
console.log("this is foo.");
} else if (this === window) {
console.log("this is window.");
}
}; // 等价于window.foo();
foo(); // this is window. // 可以看到函数中this的指向调用函数的对象
foo.boo(); // this is foo. // 使用apply改变函数中this的指向
foo.boo.apply(window); // this is window.(使用apply)
JavaScript对象中的this属性的更多相关文章
- JavaScript对象中的constructor属性
constructor属性始终指向创建当前对象的构造函数. 比如下面的例子: // 等价于 var foo = new Array(1, 56, 34, 12); var arr = [1, 56, ...
- JavaScript对象中的属性(可写,可配置,可枚举,value,getter,setter)
JavaScript中,对象包括3个特性,分别为,可扩展性,class标识符,属性. 如果对象的可扩展性为false,则不可为对象动态的添加属性. 对象包含分为存取器属性和值属性.存取属性为 {g ...
- JavaScript的事件对象中的特殊属性和方法(鼠标,键盘)
鼠标操作导致的事件对象中的特殊属性和方法 鼠标事件是 Web 上面最常用的一类事件,毕竟鼠标还是最主要的定位设备.那么通过事件对象可以获取到鼠标按钮信息和屏幕坐标获取等 鼠标按钮 只有在主鼠标按钮被单 ...
- js对象中动态读取属性值 动态属性值 js正则表达式全局替换
$(document).ready(function(){ var exceptionMsg = '${exception.message }'; var exceptionstr = ''; //j ...
- [记录] javascript 对象中使用setTimeout
参考:Javascript对象中关于setTimeout和setInterval的this介绍 使用最后一个方法终于弄好了,简直了,在对象中使用setTimeout原来是这样的 做的是分钟倒计时,倒数 ...
- 在实体对象中访问导航属性里的属性值出现异常“There is already an open DataReader associated with this Command which must be closed first”
在实体对象中访问导航属性里的属性值出现异常“There is already an open DataReader associated with this Command which must be ...
- 删除JavaScript对象中的元素
参考http://stackoverflow.com/questions/208105/how-to-remove-a-property-from-a-javascript-object 通过dojo ...
- Javascript 对象的创建和属性的判定
1. 创建对象的方法: 直接使用new 对Object对象进行操作,即对Object 对象进行实例化 <!DOCTYPE html> <html lang="en" ...
- Stream流用于按照对象中某一属性来对集合去重+简单数据类型集合的去重
上次对Stream流来进行分组的文章很多人看,想看的可以来这: Stream流来进行集合分组 这次小编又带来Stream的去重,话不多数,直接上代码: 这是对简单数据类型的去重 //字符串集合进行简单 ...
随机推荐
- MongoDB高级知识
MongoDB高级知识 一.mongodb适合场景: 1.读写分离:MongoDB服务采用三节点副本集的高可用架构,三个数据节点位于不同的物理服务器上,自动同步数据.Primary和Secondary ...
- 快速排序 java实现 (原理-优化) 三路快排
一.基本的快速排序 在数组中选取一个元素为基点,然后想办法把这个基点元素移动到它在排好序后的最终位置,使得新数组中在这个基点之前的元素都小于这个基点,而之后的元素都大于这个基点,然后再对前后两部分数组 ...
- 当在安卓低版本呈现的界面(H5)出现问题的时候,我们怎么解决?
昨天,在医院现场的客服人员,向我们反馈一个问题:说一位用户用他的安卓手机打开我们的app之后,界面是乱掉的:如下图: 向客服询问了具体的设备信息:安卓系统版本号是4.2 下意识觉得是因为css的兼容问 ...
- 2015-9-13 NOIP模拟赛解题报告(by hzwer)
小奇挖矿 「题目背景」 小奇要开采一些矿物,它驾驶着一台带有钻头(初始能力值w)的飞船,按既定路线依次飞过喵星系的n个星球. 「问题描述」 星球分为2类:资源型和维修型. 1.资源型:含矿物质量a[i ...
- 题解 UVA11300 【Spreading the Wealth】
环形均分纸牌问题应该不少人都很熟悉了,而且题解区写的也比较全了...... 我这篇题解主要是介绍一个新的STL--nth_element 以及解答几个其他题解里面有应用但是没有注释的问题.(比如说我第 ...
- jquery源码解析:jQuery静态属性对象support详解
jQuery.support是用功能检测的方法来检测浏览器是否支持某些功能.针对jQuery内部使用. 我们先来看一些源码: jQuery.support = (function( support ) ...
- Python处理json数据--世界国家维度数据
1.准备国家的json数据 将准备好的json数据放在指定的目录下,此处可以重这里下载 2.测试编写python脚本处理json提取字段值 #coding:utf8 import time, re, ...
- Mac环境下安装python库时出现ModuleNotFoundError: No module named 'XXX'
在使用pip3安装爬虫的一些有关库时发现安装成功后,import时发现又找不到,后来发现一个解决方法. 在Anaconda-Navigator里面打开environment里面寻找发现真的没有,这时再 ...
- POJ2279 Mr Young's Picture Permutations
POJ2279 Mr Young's Picture Permutations 描述: 有N个学生合影,站成左对齐的k排,每行分别有N1,N2…NK个人,第一排站最后,第k排站之前.学生身高依次是1… ...
- CSS 两个行内块元素,宽度相加刚好等于父盒子容器的元素,但第二个元素掉在第二行解决办法
我们可以发现:两个行内块元素,宽度相加刚好等于父盒子容器的元素,但第二个元素掉在第二行,这是什么问题呢? 我们先来看一下效果: <!DOCTYPE html> <html lang= ...