javascript实现方法调用与方法触发小结

在js中，this关键字是一个比较让人有意思的东西，但是它的指向经常让初学者摸不着头脑。

　　其实要理解这个关键字，需要理清两个问题——“方法的调用和方法的触发”

　　下面先看一段代码

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>function</title>
<script>
function showThis(){
  console.info(this);
}

function Test1(){
  this.f=showThis;
}
function Test2(){
  this.f=function(){
    showThis();
  }
}

showThis();//window
new Test1().f();//Test1
new Test2().f();//window
</script>
</head>
<body>
</body>
</html>

　　20行打印出window对象，这个很容易理解，但是21行打印出Test1的实例对象，而22行却打印出window对象。查看Test1和Test2的构造，发现方法f最终都执行了showThis方法。但是showThis中的this指向却不同。这是因为Test1中的f方法直接指向showThis，new Test1().f()是以Test1 的实例直接调用showThis方法，调用者是Test1的实例。而new Test2().f()是在Test2的实例方法f中触发window对象的showThis方法，其中的this就是指向其调用者window而不是触发者Test2的实例。

　　至此可以发现。this指向的是调用者，而触发者只是推进调用者执行指定方法而已。

赞 (0)

相关推荐

  • js实现浏览器窗口大小被改变时触发事件的方法

    本文实例讲述了js实现浏览器窗口大小被改变时触发事件的方法.分享给大家供大家参考.具体分析如下: 当浏览器的窗口大小被改变时触发的事件window.onresize 为事件指定代码: 复制代码 代码如下: window.onresize = function(){ } 例如: 浏览器可见区域信息: 复制代码 代码如下: <span id="info_jb51_net">请改变浏览器窗口大小</span> <script> window.onresiz

  • JS方法调用括号的问题探讨

    移动端的html页面, 写了一个函数. 复制代码 代码如下: function showAlert(msg,fn){ showDialog("alert", msg,"温馨提示",260); if(isNull(fn) == false){ $("#SD_confirm").unbind("click"); $("#SD_confirm").bind("click",fn); } } f

  • js onmousewheel事件多次触发问题解决方法

    我想做一个首屏和第二屏之间滚动鼠标滚轮就可以整平切换的效果,遇到了很多问题,后来在kk的帮助下,终于解决了这个问题,甚是欢喜,于是记录一下: 我最初的代码是这样的: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <style> div { width: 700px; height: 1000px; } .red { back

  • 深入理解Javascript动态方法调用与参数修改的问题

    Javascript中可以对所传参数在函数内进行修改,如下 复制代码 代码如下: function func1(name) {     name = 'lily';     alert(name); } func1('jack');//输出lily 再看一个例子 复制代码 代码如下: function fun1(n) {     this.name = n; } function fun2(name) {     fun1.call(this,'lily');     alert(name);

  • js触发onchange事件的方法说明

    js中onchange事件是在客户端改变输入控件的值,比如一个textbox,会出发的一个事件.但是如果在js代码中改变一个textbox的value,而不是通过键盘输入改变一个textbox值的话,是不会出发onchange事件的. 那么,如何在js代码模式通过代码触发textbox控件的onchange事件呢,经过查阅资料,发现js提供了一个方法,可以触发控件的应该是所有事件.object.fireEvent()方法,使用方法如 object.fireEvent('onchange'),即可

  • JavaScript中的方法调用详细介绍

    JavaScript中,如果function属于一个对象,那么通过对象来访问该function的行为称之为"方法调用".与普通的函数调用不同的是,在进行方法调用时,function中的this指代将发生变化 - this将指代用于调用该function的对象(该对象将成为方法调用的invocation context): 复制代码 代码如下: var x = 99; var sample = {   x:1,   act:function(a){     this.x = a*a;//

  • UpdatePanel触发javascript脚本的方法附代码

    一.预呈现数据无法更改 1.大家知道,预呈现的数据是无法更改的,以前可能提到过,这里再看demo,自定义一个控件 [DefaultProperty("Text")] [ToolboxData("<{0}:JsControl runat=server></{0}:JsControl>")] public class JsControl : WebControl { [Bindable(true)] [Category("Appeara

  • JavaScript中如何调用Java方法

    在JavaScript中想要调用Java的方法,我通过JavaScript访问servlet,再通过servlet调用Java某个类的方法. HTML代码 <table id="cartTable"> <thead> <tr> <th class="product_remove"> <label> <input class="check-all check" type="

  • javascript实现方法调用与方法触发小结

    在js中,this关键字是一个比较让人有意思的东西,但是它的指向经常让初学者摸不着头脑. 其实要理解这个关键字,需要理清两个问题--"方法的调用和方法的触发" 下面先看一段代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>function</title> <script> function showThis(

  • javascript Promise简单学习使用方法小结

    javascript Promise简单学习使用方法小结

    解决回调函数嵌套太深,并行逻辑必须串行执行,一个Promise代表一个异步操作的最终结果,跟Promise交互的主要方式是通过他的then()方法来注册回调函数,去接收Promise的最终结果值 Promise相关的协议有PromiseA和PromiseA+ 定义一个类Promise 定义属性队列queue,初始化空数组[] 定义属性值value,初始化null 定义属性状态status,初始化"pending"(默认值) 定义成员方法getQueue(),返回属性queue 定义成员

  • JavaScript在IE中“意外地调用了方法或属性访问”

    同样一段代码,两次调用,一次通过,一次异常: function clearSelect(obj){ if(obj && obj.options) obj.options.length=0; } 以下是前人的一些经验: 这是两个经典异常,不知道原理的话很难定位.从下面的代码中可用看到发生的条件 <iframe src="javascript:'<script>top.ff1={abc:function(){}}<\/script>'" wid

  • JavaScript使用function定义对象并调用的方法

    本文实例讲述了JavaScript使用function定义对象并调用的方法.分享给大家供大家参考.具体分析如下: JS中你可以通过函数的方式定义对象,下面的JS代码定义了一个movie的函数对象,然后通过new的方法声明对象,调用起来也非常简单. <script type="text/javascript"> function movie(title, director) { this.title = title; this.director = director; } v

  • iOS开发之用javascript调用oc方法而非url

    iOS开发之用javascript调用oc方法而非url

    先来看看如何在项目中的webview上面点击一个按钮,就能达到调用oc代码 上面的这个页面是webview里面嵌套的一个项目的网页,打印订单点击之后(点击事件是一个js方法),需要调用oc里面集成好的蓝牙打印机功能,来完成打印. 所以这里只能用js代码来直接调用oc代码. 1.首先创建一个iOS类,因为这里一般都需要安卓端做一套,iOS端做一套,所以一般这样命名以示区别 .h #import <Foundation/Foundation.h> #import <JavaScriptCor

  • javascript中函数作为参数调用的方法

    本文实例讲述了javascript中函数作为参数调用的方法.分享给大家供大家参考.具体分析如下: 先来看示例: function Map(){ var obj = {}; this.put = function(key, value){ obj[key] = value; } this.eachMap = function(fn){ for(var attr in obj){ fn(attr, obj[attr]); } } } var m = new Map(); m.put('01', 'a

  • JavaScript通过代码调用Flash显示的方法

    本文实例讲述了JavaScript通过代码调用Flash显示的方法.分享给大家供大家参考,具体如下: <script type="text/javascript" language="javascript" src="Scripts/swfobject.js"></script> <script language="javascript"> function load(){ var swfV

  • JavaScript子类用Object.getPrototypeOf去调用父类方法解析

    每个function有个prototype属性,称为原型.每个对象也有个原型,Firefox/Safari/Chrome/Opera 中可以通过__proto__来访问,IE6/7/8中没有提供相关接口. 复制代码 代码如下: function Person(){     this.method1 = function(){} } Person.prototype.method2 = function(){} function Man(){} Man.prototype = new Person

  • JavaScript通过字符串调用函数的实现方法

    本文实例讲述了JavaScript通过字符串调用函数的实现方法.分享给大家供大家参考.具体分析如下: JavaScript中我们可以把根据函数名的字符串来调用函数,这样我们就可以实现动态函数调用,只需要传递一个函数的名字即可调用该函数. 复制代码 代码如下: var strFun = "someFunction"; //Name of the function to be called var strParam = "this is the parameter";

随机推荐