JavaScript中this的一些怪异现象
<!--JavaScript伪协议和内联事件对于this的指向不同-->
<a href="#" onclick="alert(this.tagName);">click me</a><!--弹出A-->
<a href="javascript:alert(this.tagName);">click me</a><!--弹出undefined-->
<a href="javascript:alert(this==window);">click me</a><!--弹出true--> <input id="btn" type="button" value="this demo" name="button"/>
<script type="text/javascript">
var name = 'somebody';
var angela = {
name: 'angela',
say: function () {
alert("I'm " + this.name);
}
};
var btn = document.getElementById('btn');
//setTimeout和setInterval也会改变this的指向
/*
angela.say();//I'm angela
setTimeout(angela.say, 1000);//I'm somebody
setInterval(angela.say, 1000);//I'm somebody
*/
//on...也会改变this的指向
/*
angela.say();//I'm angela
btn.onclick = angela.say;//I'm button
*/
//匿名函数调整this指向
setTimeout(function () { angela.say(); }, 1000);//I'm angela
setInterval(function () { angela.say(); }, 1000)//I'm angela
btn.onclick = function () { angela.say(); };//I'm angela
setTimeout(function () { alert(this == window); }, 1000);//true
btn.onclick = function () { alert(this == btn); }//true
//call 和 apply调整this的指向
angela.say.call(btn);//I'm button
setTimeout(function () { angela.say.call(btn); }, 1000);//I'm button
setTimeout(function () { angela.say.apply(btn); }, 1000);//I'm button
btn.onclick = function () { angela.say.apply(btn); }//I'm button
//将this指向的对象保存到变量
var name = 'migo';
var mydemo = {
name: 'angela',
say: function () {
alert("I'm " + this.name);
},
init: function () {
var that = this;
document.getElementById('btn').onclick = function () {
that.say();//I'm angela
this.say();//这儿报错 this.say is not function
}
}
};
</script>
JavaScript中this的一些怪异现象的更多相关文章
- JavaScript中的百变大咖~this
原文链接:http://www.jeffjade.com/2015/08/03/2015-08-03-javascript-this/ JavaScript作为一种脚本语言身份的存在,因此被很多人认为 ...
- JavaScript中一些怪异用法的理解
引言 JavaScript这门语言有些场合的用法还是比较怪异的.这篇文章会尽量将这门语言特有的一些比较特殊的用法收集在一起.就当是平时开发时需要注意的地方吧. 特殊用法收集 1.!!用法 在JavaS ...
- delphi 字符串处理中的怪异现象与处理
1, 怪异现象:字符串相加操作不正常! 以上代码,明显输出字符串应含有后缀“.jpg”,但实际输出却不含后缀(如下),字符串加法操作似乎不起作用了! 采用showMessage进行输出,看看结果如何? ...
- javascript中变量提升的理解
网上找了两个经典的例子 var foo = 1; function bar() { if (!foo) { var foo = 10; } alert(foo); } bar(); // 10 var ...
- 【转】十个JavaScript中易犯的小错误,你中了几枪?
目录 常见错误一:对于this关键词的不正确引用 常见错误二:传统编程语言的生命周期误区 常见错误三:内存泄露 常见错误四:比较运算符 常见错误五:低效的DOM操作 常见错误6:在for循环中的不正确 ...
- 关于javascript中apply()和call()方法的区别
如果没接触过动态语言,以编译型语言的思维方式去理解javaScript将会有种神奇而怪异的感觉,因为意识上往往不可能的事偏偏就发生了,甚至觉得不可理喻.如果在学JavaScript这自由而变幻无穷的语 ...
- 你所不了解的float(滥用float的怪异现象)
float设计初衷就是为了实现文字环绕效果 原本页面流布局显示如上图所示,运用了float属性后就显示为如下图所示,这就是浮动的设计初衷 float的一些特性:包裹性.破坏性. 包裹的特性其实主要有三 ...
- JavaScript中的作用域
很多(JavaScript)开发者都在讨论"作用域",但它是什么?它们在JavaScript中的任何地方!我发现很多年轻的开发者不知道作用域是什么.他们中大多数人可以用jQuery ...
- 深入理解Javascript中this, prototype, constructor
在Javascript面向对象编程中经常需要使用到this,prototype和constructor这3个关键字. 1.首先介绍一下this的使用:this表示当前对象;如果在全局中使用this,则 ...
随机推荐
- PHP对图片按照一定比例缩放并生成图片文件
list($width, $height)=getimagesize($filename);//缩放比例$per=round(400/$width,3); $n_w=$width*$per;$n_h= ...
- Ubuntu 16.04 启动错误 "a start job is running for hold until boot process finishes up"
老司机也差点翻船... 升级16.04的时候,将默认启动管理器(default display manager)选为gm3(gnome3)了(应该使用默认的lightgm)如果改成gm3,好像是nvi ...
- ASP.NET Core 1.0 入门——了解一个空项目
var appInsights=window.appInsights||function(config){ function r(config){t[config]=function(){var i= ...
- btn-default
Bootstrap 还有一种属于按钮的 class 属性叫做btn-default . to
- DIY操作系统(引文)
构想根据<30天自制操作系统>以及<ORANGE’S:一个操作系统的实现>初步实现一个操作系统. 先开个头,以后的棋一步一步下.
- 数据库表中存在Text类型的属性时,写sql语句时需要注意喽!
之前,习惯性地写查询语句时,查询条件用“=”判断.今天写程序的时候,查询时突然报了一个错误:数据类型text 和varchar 在equal to 运算符中不兼容.查看了一下数据库发现,其中有一个属性 ...
- 远程连接oracle服务器
用户名 / 密码@172.16.16.203:1521/orcl
- [置顶]PADS PCB功能使用技巧系列之NO.001- 如何走蛇形线?
蛇形线是布线过程中常用的一种走线方式,其主要目的是为了调节延时满足系统时序设计要求,但是设计者应该有这样的认识:蛇形线会破坏信号质量,改变传输延时,布线时要尽量避免使用,因此一块PCB上的蛇形线越多并 ...
- windows下安装iReport 并确保启动正确
突然从润乾转到iReport ,我也很蒙.突然离开了万能的客服,我心不甘.现在所有资料都要自己查找,只好做个记录.现在从安装开始说. 此时安装的最新版是5.6.0,要知道,网上大部分资料都是4.X,更 ...
- js基础知识:表达式
一.什么是表达式?我理解的"表达式":程序执行到1个"表达式"时,会返回1个值到这个"表达式"所在的位置. var a = 10 , b = ...