javaScript之this的五种情况
this一直是JavaScript研究的难题,特别是在笔试和面试中的各种程序分析问题中,也常常会被问到。下面来看一看this被运用的五中情况:
(1) 纯粹的函数调用
函数最普通用法,此时属于全局调用,函数内this指向全局对象window。
示例一:
var x=20;
function test(){
var x = 10;
console.log(this.x)
}
输出:20,因为函数test执行环境为window。
示例2:
var x=20;
function test(){
this. x = 10;
console.log(this.x)
}
test()
console.log(x);
输出:
10
10
由于test函数内部this指向window,所以第3行代码修改了x的值。
(2) 作为对象的方法使用
函数作为某个对象的方法,此事this指向该对象。
function text(){
console.log(this.x)
}
var obj = {};
obj.x = 10;
obj.out = text;
obj.out()
输出: 10
(3) 构造函数生成实例对象
作为构造函数使用时,this指向该对象新创建的实例。
var x = 2;
function text(){
this.x =1;
}
var inst = new text();
console.log(inst.x);
输出: 1
(4) 使用apply
apply()方法是改变函数内部this的值,若为空默认是指向全局对象window。
var x = 2;
function test(){
console.log (this.x);
}
var obj={};
obj.x = 1;
obj.m = test;
obj.m.apply();
obj.m .apply (obj);
输出:
2
1
第8行代码将函数内部的this指向window,故输出为2。第9行代码等价于obj.m()。因为作为对象方法的函数其内部this就指向该对象。
(5)事件处理程序中的this
在DOM级事件处理程序中this指向触发事件的元素,而对于IE事件来说,this指向全局对象window。
HTML:
<input id="myinput" type="text" value="javascript中onclick中的this" onclick=" test(this);"/>
javaScript:
function test(obj){
alert(obj); //[object HTMLInputElement]
alert(obj.id); //myinput
alert(obj.value); //javascript中onclick中的this
}
还有闭包中的this是指向window的,掌握以上几种运用方法,相信你可以所向睥睨。
javaScript之this的五种情况的更多相关文章
- Javascript判断数据类型的五种方式及其特殊性
Javascript判断数据类型的五种方式及区别 @ 目录 typeof instanceof Object.prototype.toString isArray iisNaN ----------- ...
- 五种情况下会刷新控件状态(刷新所有子FWinControls的显示)——从DFM读取数据时、新增加子控件时、重新创建当前控件的句柄时、设置父控件时、显示状态被改变时
五种情况下会刷新控件状态(刷新控件状态才能刷新所有子FWinControls的显示): 在TWinControls.PaintControls中,对所有FWinControls只是重绘了边框,而没有整 ...
- hdu 5060 五种情况求圆柱体与球体交
http://acm.hdu.edu.cn/showproblem.php?pid=5060 官方题解http://bestcoder.hdu.edu.cn/给复杂了 实际上用圆柱体与球体体积差的积分 ...
- css3动画贝塞尔曲线cubic-bezier,css3动画的五种情况
当大家开始做css3动画的时候,了解贝塞尔曲线就成了不可或缺的.“贝赛尔曲线”是由法国数学家Pierre Bézier所发明,由此为计算机矢量图形学奠定了基础.它的主要意义在于无论是直线或曲线都能在数 ...
- 五种情况会导致Session 丢失
1.Session到期自定丢失.2.当修改web.config 系统会重启 SESSION 会丢失.3.Bin目录有变化时候系统会重启 SESSION会丢失 (这里变化指的是,创建新文件.修改文件名 ...
- 探究JavaScript中的五种事件处理程序
探究JavaScript中的五种事件处理程序 我们知道JavaScript与HTML之间的交互是通过事件实现的.事件最早是在IE3和Netscape Navigator 2中出现的,当时是作为分担服务 ...
- 从零开始学习前端JAVASCRIPT — JavaScript中this指向的四种情况
JavaScript中this的四种情况(非严格模式) 1.当this所在函数是事件处理函数时,this指向事件源.2.当this所在函数是构造函数时,this指向new出来的对象.3.this所在函 ...
- this的五种指法
this 到底指向哪里 以下如果没提及,则为严格模式. js中作用域有两种: 词法作用域 动态作用域 词法作用域 词法作用域指在书写代码时就被确定的作用域.看如下代码 var value = 1; f ...
- JavaScript常见的五种数组去重的方式
▓▓▓▓▓▓ 大致介绍 JavaScript的数组去重问题在许多面试中都会遇到,现在做个总结 先来建立一个数组 var arr = [1,2,3,3,2,'我','我',34,'我的',NaN,NaN ...
随机推荐
- Java实现时间日期格式转换示例
package com.hanqi.util; import java.text.ParseException; import java.text.SimpleDateFormat; import j ...
- mysql主从复制(windows下)
简单搭建mysql主从服务器(双向复制),仅供学习之用. 1.下载mysql-advanced-5.6.16-winx64.zip 下载完成后解压,重命名成mysql,分别放入两台服务器(看第二点集群 ...
- Mysql的空值与NULL的区别
Mysql数据库是一个基于结构化数据的开源数据库.SQL语句是MySQL数据库中核心语言.不过在MySQL数据库中执行SQL语句,需要小心两个陷阱. 陷阱一:空值不一定为空 空值是一个比较特殊的字段. ...
- var妙用
var广泛使用其实也有用的.比如在一些不太确定类型的地方 (比如要区分int/uint/long/double的时候),用泛型太牛刀而不用又觉得不灵活的时候,其实是比较推荐var的比如设计某种类的时候 ...
- dsp2812 pwm配置
肚子疼了好几天,今天稍微好点,简单写点东西. 好几个月前做的项目,有些地方已经记不清楚了,但是突然客户又来问关于代码配置的情况,重新查看了代码,把相关的知识也整理一下. dsp2812中有好几个时钟相 ...
- 升级到JDK8,编译时发生 Error:java: java.lang.ExceptionInInitializerError
编译的时候出现这个问题.使用1.7的jdk没问题,但是由于po主的项目中,使用了java8编写的代码,解决java8兼容问题成为解决这个问题的首选方案. 这个日志太过简单,只告知一个异常信息,这个异常 ...
- 仿联想商城laravel实战---7、lavarel中如何给用户发送邮件
仿联想商城laravel实战---7.lavarel中如何给用户发送邮件 一.总结 一句话总结: 设置邮件服务器,比如163邮箱 lavarel中配置邮件服务,在.env中 控制器中使用Mail对象发 ...
- django 使用内建过滤器实现文章摘要效果
django 使用内建过滤器实现文章摘要效果 前端html代码 <div class="list-group"> {% if articles %} {% for ar ...
- jQuery JS 入门记录
1.类型转换 .toString() 转字符串 . parseInt() parseFloat() 强制转换 数字型(Number) 1.声明 var i = 1; var i = new Numbe ...
- 十三 Django框架,CSRF跨站请求伪造
全局CSRF 如果要启用防止CSRF跨站请求伪造,就需要在中间件开启CSRF #中间件 MIDDLEWARE = [ 'django.middleware.security.SecurityMidd ...