this和arguments

this是面向对象语言中的一个重要概念,在JAVA,C#等大型语言中,this固定指向运行时的当前对象。但是在javascript中,由于javascript的动态性(解释执行,当然也有简单的预编译过程),this的指向在运行时才确定。这个特性在给我们带来迷惑的同时也带来了编程上的自由和灵活,结合apply(call)方法,可以使JS变得异常强大。

2.变化的this
在JavaScript中,this通常指向的是我们正在执行的函数本身,或者是指向该函数所属的对象(运行时)。当我们在页面中定义了函数doSomething()的时候,它的owner是页面,或者是JavaScript中的window对象(或global对象)。对于一个onclick属性,它为它所属的HTML元素所拥有,this应该指向该HTML元素。

2.1在几种常见场景中this的变化

函数示例
function doSomething ()
{
alert(this.navigator); //appCodeName
this.value = "I am from the Object constructor";
this.style.backgroundColor = "# 000000";
}
1. (A)作为普通函数直接调用时,this指向window对象.

2. (B)作为控件事件触发时

1) inline event registration 内联事件注册 .将事件直接写在HTML代码中(<element

οnclick=”doSomething()”>), 此时this指向 window对象 。

2) Traditional event registration 传统事件注册 (DHTML方式).
形如 element.onclick = doSomething; 此时this指向 element对象

3) <element οnclick=”doSomething(this)”>作为参数传递可以指向element

3. (C)作为对象使用时this指向当前对象。形如:new doSomething();
4. (D)使用apply 或者call方法时,this指向所传递的对象。

形如:var obj={}; doSomething.apply(obj,new Array(”nothing”); //thisobj
2.2 this 指向分析

1 A场景。
直接调用的情况下,doSomething的运行时拥有者是window对象,因此this指向window
图示:

图1:A场景

2 B场景。
1)Traditional Event Registration
当我们要让函数中的this指向当前HTMLELEMENT时,可这样写
element.onclick = doSomething;
doSomething的引用(地址)赋给了element的onclick属性(这样就成为了函数)。此时
doSomething运行时拥有者(owner)就变成了element,this便指向了element。

图示:

图2: B场景 Traditional Event Registration

进行批量添加事件时,this均可正确指向。

图示:

图3: 多次Traditonal Event Registration

2) Inline Event Registration
形如 <element οnclick=”doSomething()”>
图示:

图4:B场景 Inline Event Registration

这两种注册方式的区别是
element.onclick = doSomething;
alert(element.onclick)
可以得到
function doSomething() {
alert(this.navigator); //appCodeName
this.value = "I am from the Object constructor";
this.style.backgroundColor = "# 000000";
}
可以看到this关键字被展现在onclick函数中,它指向HTML元素。

如果执行
<element οnclick="doSomething()">
al ert(element.onclick)

可以得到 :
function onclick(){
doSomething();
}

这仅仅是对doSomething()函数的一次调用,而doShomething的拥有者是window,因此 doSomething内的this指向window对象(啰嗦哦…….).

3 . C场景
具体内部细节不太了解,不知道是否可以这样理解
new doSomething(…..)
约等同于
var tempObj = {}; doSomething.apply(obj,new Array());
这样tempObj 可以得到doSomething内所定义的属性和方法,但是对 于 doSomething.prototype上的属性方法无法得到-_-!!

4 D场景
不懂…..

完了
不专业,比较浅显,想不出几个专有名词,郁闷~

PS 1:好多内容是copy的(*_*!),对图中表达有点疑意。图上多次写出 copy of function ,按照字面理解是函数对象的拷贝,我认为实际上是一个引用拷贝,对象拷贝是不可能的,如果是这样的话,每次添加事件都会拷贝一次对象,这显然不妥。

PS 2: 因为this指向在运行时才确定,我们经常碰到一个问题,当给一个DOM对象添加事件后,我们希望this指向一个指定对象,而非DOM对象本身,如下例。
<input type="button" id='btn' />
<script language="javascript">function btnObj(id)
{
this.disabled = true;
this.btn=document.getElementById(id);
/*
this.btn.onclick = btnOnclick ;
假如我们这样写,this会指向DOM对象,btnOnclick执行过程会报错
因为DOM btn并没有一个btn属性
*/
//通过这种方式可以解决这个问题[有些情况也可用tempThis = this这种形式]
this.btn.onclick = passHandler(this,btnOnclick);}function btnOnclick()
{

//如果this是DOM对象,这里就会报错,因为没有btn属性
this.btn.disabled = this.disabled;
}

function passHandler(obj,fun,arg)
{
return function(){
//if(!arg) {var arg = [];}
return fun.apply(obj,(arg?arg:[]));
}
}

new btnObj(”btn”);
</script>

 

arguments 属性

为当前执行的 function 对象返回一个arguments 对象。

function.arguments

function 参数是当前执行函数的名称,可以省略。

说明

通过 arguments 属性,函数可以处理可变数量的参数。 arguments 对象的 length 属性包含了传递给函数的参数的数目。对于arguments 对象所包含的单个参数,其访问方法与数组中所包含的参数的访问方法相同。

示例

下面的例子说明了 arguments 属性的用法:

function ArgTest(){ var i, s, numargs = arguments.length; s = numargs; if (numargs < 2) arguments 属性

为当前执行的 function 对象返回一个arguments 对象。

function.arguments

function 参数是当前执行函数的名称,可以省略。

说明

通过 arguments 属性,函数可以处理可变数量的参数。 arguments 对象的 length 属性包含了传递给函数的参数的数目。对于arguments 对象所包含的单个参数,其访问方法与数组中所包含的参数的访问方法相同。

示例

下面的例子说明了 arguments 属性的用法:

function ArgTest(){ var i, s, numargs = arguments.length; s = numargs; if (numargs < 2)

在举个列子

<script language="JavaScript">
/**//*
* 演示arguments的用法,如何获取实参数和形数数
*/
function argTest(a,b,c,d){
var numargs = arguments.length; // 获取被传递参数的数值。
var expargs = argTest.length; // 获取期望参数的数值。
alert("实参数目为:"+numargs)
alert("形数数目为:"+expargs)

alert(arguments[0])
alert(argTest[0]) //undefined 没有这种用法
}
//argTest(1,2)
//argTest(1,2,3,4,5)

/**//*
* arguments不是数组(Array类)
*/

Array.prototype.selfvalue = 1;
function testAguments(){
alert("arguments.selfvalue="+arguments.selfvalue);
}
//alert("Array.sefvalue="+new Array().selfvalue);
//testAguments();

转载于:https://www.cnblogs.com/delin/archive/2010/06/17/1759711.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/475952.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

LeetCode 529. 扫雷游戏(广度优先搜索BFS/深度优先搜索DFS)

文章目录1. 题目2. 解题2.1 BFS2.2 DFS1. 题目 让我们一起来玩扫雷游戏&#xff01; 给定一个代表游戏板的二维字符矩阵。 ‘M’ 代表一个未挖出的地雷&#xff0c; ‘E’ 代表一个未挖出的空方块&#xff0c; ‘B’ 代表没有相邻&#xff08;上&#xff0c;下&#xff0c;左…

java 使用jar_Java 使用JAR文件

JAR&#xff0c;Java Archive File&#xff0c;Java档案文件。JAR文件是一种压缩文件&#xff0c;与ZIP压缩文件兼容&#xff0c;通常称为JAR包。JAR文件中默认包含了一个名为META-INF/MANIFEST.MF的清单文件&#xff0c;是在生成JAR文件时由系统自动创建的。使用JAR文件与以下…

Flash 与数学:圆的切线(3)

在上面几节当中&#xff0c;已经了解过计算圆上任意一点的切线的方法&#xff0c;我们首先知道使用导数几何意义在哪里&#xff1f;在我们高中数学和大学的数学当中&#xff0c;说明了。导数的几何意义函数yf&#xff08;x&#xff09;在点x0处导数为f(x0)在几何上表示曲线yf&a…

LeetCode 1110. 删点成林(二叉树递归)

1. 题目 给出二叉树的根节点 root&#xff0c;树上每个节点都有一个不同的值。 如果节点值在 to_delete 中出现&#xff0c;我们就把该节点从树上删去&#xff0c;最后得到一个森林&#xff08;一些不相交的树构成的集合&#xff09;。 返回森林中的每棵树。你可以按任意顺序…

Asp.net 编码函数

属于Server类 HtmlEncode UrlEncode转载于:https://www.cnblogs.com/hahacjh/archive/2010/06/21/1761822.html

LeetCode 973. 最接近原点的 K 个点(排序/优先队列/快排)

文章目录1. 题目2. 解题2.1 排序2.2 优先队列2.3 快排思路1. 题目 我们有一个由平面上的点组成的列表 points。需要从中找出 K 个距离原点 (0, 0) 最近的点。 &#xff08;这里&#xff0c;平面上两点之间的距离是欧几里德距离。&#xff09; 你可以按任何顺序返回答案。除了…

创建链表

代码#include <iostream>usingnamespacestd;structstudent //定义结构体{ intdata; student *next;};//创建链表student *CreateList(){ student *headNULL; student *pnewstudent; cin>>p->data; student *endp; while(p->data!0…

LeetCode 1286. 字母组合迭代器(回溯/位运算)

文章目录1. 题目2. 解题2.1 回溯2.2 位运算1. 题目 请你设计一个迭代器类&#xff0c;包括以下内容&#xff1a; 一个构造函数&#xff0c;输入参数包括&#xff1a;一个 有序且字符唯一 的字符串 characters&#xff08;该字符串只包含小写英文字母&#xff09;和一个数字 c…

[Ubuntu]Apt-get命令参数详解

常用的APT命令参数&#xff1a;apt-cache search package 搜索包apt-cache show package 获取包的相关信息&#xff0c;如说明、大小、版本等sudo apt-get install package 安装包sudo apt-get install package - - reinstall 重新安装包sudo apt-get -f install 修复安装"…

java 密码 md5_java怎么去判断md5加密的密码啊?

对两次的加密字符进行比较&#xff0c;MD5加密的结果是一样的&#xff0c;所以每次进行加密后的密文进行匹配比较。java代码加密import java.security.MessageDigest;import java.security.NoSuchAlgorithmException;public class MD5Utils {public static void main(String[] …

PageRank 算法

文章目录1. PageRank 的定义1.1 基本想法1.2 PageRank 的基本定义1.3 PageRank 的一般定义2. PageRank 的计算2.1 迭代算法2.2 幂法2.3 代数算法PageRank算法是图的链接分析&#xff08;link analysis&#xff09;的代表性算法&#xff0c;属于图数据上的无监督学习方法。 Pag…

基于Java+SpringMvc+Vue求职招聘系统详细设计实现

基于JavaSpringMvcVue求职招聘系统详细设计实现 &#x1f345; 作者主页 专业程序开发 &#x1f345; 欢迎点赞 &#x1f44d; 收藏 ⭐留言 &#x1f4dd; &#x1f345; 文末获取源码联系方式 &#x1f4dd; 文章目录 基于JavaSpringMvcVue求职招聘系统详细设计实现一、前言介…

NameValueCollection详解

1.NameValueCollection类集合是基于 NameObjectCollectionBase 类。 但与 NameObjectCollectionBase 不同&#xff0c;该类在一个键下存储多个字符串值&#xff08;就是键相同&#xff0c;值就连接起来如下例子&#xff09;。该类可用于标头、查询字符串和窗体数据。每个元素都…

一名英格兰球迷眼里的本届英格兰队

英格兰的世界杯旅程昨晚被德国终结了。身为一个英格兰的球迷的确心里不好受。比赛中兰帕德的本来可以扳平比 分的一粒进球被判无效&#xff08;难道真的“兰怕德”了&#xff1f;&#xff09;&#xff0c; 是整场比赛最大的争议点。有些人认为此球误判导致英格兰的最后大比分失…

无监督学习方法总结

文章目录1. 无监督学习方法的关系和特点1.1 各种方法之间的关系1.2 无监督学习方法1.3 基础机器学习方法1. 无监督学习方法的关系和特点 八种常用的统计机器学习方法&#xff1a; 聚类方法&#xff08;层次聚类、k均值聚类&#xff09;奇异值分解&#xff08;SVD&#xff09;…

java继承序列化_java中序列化之子类继承父类序列化

当一个父类实现Serializable接口后&#xff0c;他的子类都将自动的实现序列化。以下验证了这一点&#xff1a;package Serial;import java.io.Serializable;public class SuperC implements Serializable {//父类实现了序列化int supervalue;public SuperC(int supervalue) {th…

LeetCode 1324. 竖直打印单词

1. 题目 给你一个字符串 s。请你按照单词在 s 中的出现顺序将它们全部竖直返回。 单词应该以字符串列表的形式返回&#xff0c;必要时用空格补位&#xff0c;但输出尾部的空格需要删除&#xff08;不允许尾随空格&#xff09;。 每个单词只能放在一列上&#xff0c;每一列中也…

SubSonic中的字段付值--MakeOld Update

根据设计当MakeOld后&#xff08;在读取数据库后&#xff0c;或者手动调用&#xff09;&#xff0c;对记录(SubSonic生成的类&#xff09;属性附值时&#xff0c;Sonic会检测这个Value是否与原来的不同&#xff0c;只有值不同时才会附值成功&#xff0c;并将该列添加到DirtyCol…

java从控制台输入数组_Java将控制台输入的一行整数转成整型数组

思路&#xff1a;将一行数据按字符串的形式读取进来。首先判断输入的字符串是不是空&#xff0c;为空的话&#xff0c;则不作任何操做。其次&#xff0c;将字符串按照指定方式切分为字符串数组&#xff0c;此处是按照空格切分&#xff0c;由于输入是按空格区分的。最后&#xf…

java私有表示标识_java里面的标识符、关键字和类型

1. 注释Java中有三种注释&#xff1a;(1) // -单行注释&#xff0c;注释从“//”开始&#xff0c;终止于行尾&#xff1b;(2) -多行注释&#xff0c;注释从““结束&#xff1b;(3) -是Java特有的doc注释&#xff0c;这种注释主要是为支持JDK工具Javadoc而采用的。Javadoc能识…