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,则 ...
随机推荐
- oracle DBMS_LOCK.SLEEP()的使用
create or replace procedure times isii positive:=1;beginloop dbms_lock.sleep(1);dbms_output.put_line ...
- 安卓稳定性压测工具_monkey环境搭建(简易)
1.准备工具: sdk(64位操作系统):http://pan.baidu.com/s/1kV33pll sdk(32位操作系统):http://pan.baidu.com/s/1gfnww87 2. ...
- gulp 配置自动化前端开发
有的人说,grunt已经廉颇老矣,尚能饭否.gulp已经成为了未来的趋势,或许将撼动grunt的地位. 那么就得看看gulp到底优势在哪里,在我最近的使用中发现,我的到了一个结论:“grunt廉颇老矣 ...
- awk用法总结笔记
+ : 匹配1或多次出现的字符或正则表达式 awk '/col+/' testfile ? : 匹配0或1次出现的字符或正则表达式 awk '/col+/' testfile | : 匹 ...
- Codeforces #380 div2 E(729E) Subordinates
E. Subordinates time limit per test 1 second memory limit per test 256 megabytes input standard inpu ...
- [原] XAF 如何启用ListView Top N records 提升用户使用体验
為了提升用戶使用體驗,特擴展此功能(來源與Xafari Framework).1.可在模型編輯器中設置是否啓用,默認啓用.2.DataAccessMode為Client模式才啓用.其它模式自動關閉.3 ...
- Await, and UI, and deadlocks! Oh my!
It’s been awesome seeing the level of interest developers have had for the Async CTP and how much us ...
- CPU与内存的关系
至今才对cpu和内存有一定了解了,下面有几个比喻的理解,很形象呦~ 1# 例如你要吃东西时,硬盘是锅,内存是碗,CPU是你,浅显点就是这样子了~ 2# 例如电脑是企业,内存是车间,cpu是生产线,硬盘 ...
- 【转载】硬盘MBR详细介绍
原文地址:http://blog.chinaunix.net/uid-15007890-id-106892.html 硬盘MBR详细介绍 硬盘是现在计算机上最常用的存储器之一.我们都知道,计 ...
- 01 选择 Help > Install New Software,在出现的对话框里,点击Add按钮,在对话框的name一栏输入“ADT”,点击Archive...选择离线的ADT文件,contact all update ....千万不要勾选点击Add按钮,在对话框的name一栏输入“ADT”,点击Archive...选择离线的ADT文件,contact all update ....千万不要勾
引言 好久没碰过android,今天重新搭建了一次环境,遇到的问题记录下载.共以后使用. 安装 软件的软件有jdk+eclipse+adt+sdk 主要记录安装adt和sdk的过程,注意,adt和sd ...