this,this,再次讨论javascript中的this,超全面
至于js中this这个东西,好多淫解释过了,看起来好高端的样子,不造你看懂了木有?
先引用比较高端的,“汤姆大叔“ 的,yes this
好了,下面加上鄙人比较挫的解释
论点: this 不是变量,不是属性,不能为其赋值,它始终指向调用它的对象
感觉还TM太虚了,只要记住最重要的一条即可 ”它始终指向调用它的对象“ ,所以找到调用this的对象,就知道this到底指向谁了
1、
alert(this);
瞅瞅,弹出来的是么子,要么是”object window“ ,要么 "object" 总之就对象了,是那个对象呢?
alert(this === window);
结果为'true' 所以了,现在调用它的对象是window了
2、
var test = function(){
alert(this);
}
test();
猜猜上面弹出什么,是不是和"alert(this)" 这句一样的
var test = function(){
alert(this === window);
}
test();
运行上面的代码,是不是弹出了'true' ?
事情就这样完了?
要这么简单的话,何必那么多人都去论述这个鸟了?
3、
再来
var test = function(){
alert(this === window);
}
new test();
哎哎,这次咋成'false'呢?
记住”this 始终指向调用它的对象“,第”1、“处调用该段代码的直接对象是全局对象,即"window" ;第”2、“处虽然是函数,但是调用其的仍然是”window“(不要弄混了,函数虽然是对象,但是调用它的是另一个对象);第”3、“处,使用了”new“ 这时其实已经发生变化了,这是一个构造函数,构造函数创建时创建了一个新的空的对象,即”new test()“创建了一个新的对象,然后再由这个对象指向函数"test"中的代码,因此此时this不在是window对象,而是该构造函数创建的新对象。
4、
var test ={
'a':1,
'b':function(){
alert(this === test)
}
}
test.b();
有了上面的论点,这下一下子清楚了吧!
5、
var test ={
'a':1,
'b':function(){
alert(this === test)
}
}
var test1 = test;
test1.b();
so, 你不会认为结果为"false"吧,错了,虽然'test1'的值为'test' 但是'test1'不还是'test'对象么,它有新产生对象,你暂且理解为引用的了,两个都指向一个对象,奉上下面一段代码为证
var test ={
'a':1,
'b':function(){
alert(this === test)
}
}
var test1 = test;
test.a = 2;
alert(test1.a);
如果弹出了”1“,你来骂我
6、再整个复杂的
var test ={
'a':1,
'b':{
'b1':function(){
alert(this === test);
}
}
}
test.b.b1();
这是"true"还是"false"呢?
按照上面的理论,这时"this"不再直接被'test'调用了,而是被'test.b' 调用, 奉上下面一段代码为证
var test ={
'a':1,
'b':{
'b1':function(){
alert(this === test.b);
}
}
}
test.b.b1();
7、好再整个复杂点的
var test = function(){
var innerTest = function(){
alert(this === test);
}
innerTest();
}
test();
你不会认为弹出"true"吧,不是按照上面的理论'innerTest'是被'test'调用的,然后'this'就指向'test'吗?
额,错就错在是谁调用的'innerTest', 其实这种函数都是'window'对象调用的,及时你嵌套一千层,调用各个函数的都是'window'对象,奉上下面这段代码为证
var test = function(){
var innerTest = function(){
alert(this === window);
var innerTest1 = function(){
alert(this === window);
}
innerTest1();
}
innerTest();
}
test();
8、再来一段特殊的
var test = function(){
alert(this === window);
}
var test1 = {
}
test.apply(test1);
这个我觉得大家都不会猜错,该函数的作用就是”调用一个对象的一个方法,以另一个对象替换当前对象“ 所以了'window' 对象已经被替代为'test1',自然为'false'了,奉上如下代码以为证明
var test = function(){
alert(this === test1);
}
var test1 = {
}
test.apply(test1);
那么诸如'call'之类的也就相似了
9、再来一个原型的继承,区别于字面量的继承
var test = function(){
}
var my = function(){
this.a = function(){
alert(this === mytest2);
}
}
var mytest = new my();
test.prototype = mytest;
var mytest2 = new test();
mytest2.a();
10、还剩下些什么了,可能就是'dom'对象了
<script>
var mytest = function(context){
alert(context.getAttribute('id'));
alert(this === window);
}
</script>
<div id="test" onclick="mytest(this)">aaaa</div>
看了上面的应该了解了吧,里面的'this'分别代表神马
好了,鄙人才疏学浅,目前就造这点,有不足之处,欢迎补足!
this,this,再次讨论javascript中的this,超全面的更多相关文章
- 再次讨论javascript 中的this
原文: http://www.jb51.net/article/77519.htm 核心总结: 1.不论函数在哪里被调用,只要没有指定调用方,则this都指向window.指定了调用方,就指向调用方. ...
- JavaScript从初见到热恋之深度讨论JavaScript中的面向对象。
JavaScript中的面向对象.面向对象的三个基本特征:封装.继承.多态. 1.封装 js的封装如下 定义Person类 function Person(name,age,sex) { this.n ...
- 再次学习javascript中的參数传递
javascript中的全部函数的參数传递都是依照值传递的,做了以下測试: function addTen(num){ num +=10; return num; } var count = ...
- 通过代数,数字,欧几里得平面和分形讨论JavaScript中的函数式编程
本文是对函数式编程范式的系列文章从而拉开了与以下延续一个. 介绍 在JavaScript中,函数只是对象.因此,可以构造函数,作为参数传递,从函数返回或分配给变量.因此,JavaScript具有一流的 ...
- 再次理解javascript中的事件
一.事件流的概念 + 事件流描述的是从页面中接收事件的顺序. 二.事件捕获和事件冒泡 + 事件冒泡接收事件的顺序:
- javascript 中加’var‘和不加'var'的区别,你真的懂吗?
没看之前千万别说我是标题党,这个问题真的有好多淫都不懂!!! 大家都看了很多文章,都说避免隐式声明全局变量,就是说声明变量前必须加'var',那加了'var'和不加'var'到底有啥区别呢? 先来看一 ...
- javascript中加var和不加var的区别
Javascript是遵循ECMAScript标准下的一个产物,自然ECMAScript的标准其要遵循. 先来看下var关键字的定义和用法 var 语句用于声明变量. JavaScript 变量的创建 ...
- JavaScript中的内存泄漏以及如何处理
随着现在的编程语言功能越来越成熟.复杂,内存管理也容易被大家忽略.本文将会讨论JavaScript中的内存泄漏以及如何处理,方便大家在使用JavaScript编码时,更好的应对内存泄漏带来的问题. 概 ...
- javascript中的Array对象 —— 数组的合并、转换、迭代、排序、堆栈
Array 是javascript中经常用到的数据类型.javascript 的数组其他语言中数组的最大的区别是其每个数组项都可以保存任何类型的数据.本文主要讨论javascript中数组的声明.转换 ...
随机推荐
- cocos2d-x之事件传递
bool HelloWorld::init() { if ( !Layer::init() ) { return false; } Size size=Director::getInstance()- ...
- 第一篇 UEditor入门部署和体验
UEditor 是由百度「FEX前端研发团队」开发的所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码. UEditor富文本编辑器,轻量, ...
- 微信支付.NET版开发总结(JS API),好多坑,适当精简
前2天,做一个手机网页的微信支付的项目,费了好些周折,记录一下.接下来,按照开发步骤,细数一下,我遇到的那些坑. [坑1]官方邮件中下载的demo只有PHP版本,其他版本没有给链接.可能让人误以为只有 ...
- Linux上Eclipse项目右键菜单没有Maven
在Centos 7上安装了eclipse以后,着实很兴奋.eclipse luna版本自带maven.但是用mvn eclipse:eclipse创建的java工程,在右键菜单居然没有Maven按钮, ...
- NOIP2008 普及组T4 立体图 解题报告-S.B.S.(施工未完成)
题目描述 小渊是个聪明的孩子,他经常会给周围的小朋友们将写自己认为有趣的内容.最近,他准备给小朋友们讲解立体图,请你帮他画出立体图. 小渊有一块面积为m*n的矩形区域,上面有m*n个边长为1的格子,每 ...
- C++ 之 常量成员函数
类的常量成员函数 (const member function), 可以读取类的数据成员,但是不能修改. 1 声明 1.1 const 关键字 在参数列表后,加 const 关键字,声明为常量成员 ...
- Java后端实现图片压缩技术
今天来说说图片压缩技术,为什么要使用图片压缩,图片上传不就完事了吗?对的,这在几年前可以这么说,因为几年前还没有现在这么大的并发,也没有现在这么关注性能. 如今手机很多,很多人都是通过手机访问网络或者 ...
- MongoDB学习(四)客户端工具备份数据库
在上一篇MongoDB学习(三)中讲解了如何在服务器端进行数据的导入导出与备份恢复,本篇介绍下如何利用客户端工具来进行远程服务器的数据备份到本地. 以客户端工具MongoVUE为例来进行讲解: 1.首 ...
- java 21 - 14 Properties类
类 Properties Properties 类表示了一个持久的属性集.Properties 可保存在流中或从流中加载.属性列表中每个键及其对应值都是一个字符串. 注意:Properties是Has ...
- 程序清单8-3 8-4 演示不同的exit值
//http://blog.chinaunix.net/uid-24549279-id-71355.html /* ========================================== ...