好久没写东西了,最近有些迷茫(好吧,是借口),也是好久没有接触js的内容了,今天就借此契机,顺便复习下吧。

就看看javascript中的函数四大调用模式和this的关系

1.方法调用模式

当一个函数被保存为对象的一个属性时,我们称它为一个方法。当一个方法被调用时,this被绑定到该对象。如果一个调用表达式包含一个属性存取表达式(即一个.点表达式或[subscript]下标表达式),那么它被当做一个方法来调用。
方法可以使用this去访问对象,所以它能从对象中取值或修改该对象。
初看比较难以理解,就是说,对象里面是可以有方法的
Object fangShui={
  eng:1,
  chn:2,
  say:function(flagStatus){//say这个方法是对象的字面量,原型连到fangShui,方法内部是可以访问对象的字面量的
    if(flagStatus===this.eng){//eng是对象的字面量
      alert("makewater");
    }else if(flagStatus===this.chn){//chn也是对象的字面量
      alert("fangshui");
    }else{
    }
  }
};

fangShui.say(1);

结果就是makewater

2.函数调用模式

当一个函数并非一个对象的属性时,那么它被当做一个函数来调用:
var sum=add(3,4);
当函数以此模式调用时,this被绑定到全局对象。这是语言设计上的一个错误。倘若语言设计正确,当内部函数被调用时,this应该仍绑定到外部函数的this变量。这个设计错误的后果是方法不能利用内部函数来帮助它工作,因为内部函数的this被绑定了错误的值,所以不能共享该方法对对象的访问权。幸运的是,有一个很容易的解决方案:如果该方法定义一个变量并给它赋值为this,那么内部函数就可以通过那个变量访问到this按照约定,我们给那个变量命名为that。
举个例子:
function shaZhuDe(prefixArg){
  this.prefix=prefixArg;
  var that=this;
  function shaZhuDao(daos2){//这个函数的上下文被不幸地绑到了全局变量,本应该被绑到其外部函数即shaZhuDe的上下文的
    return that.prefix+" "+daos2;//还好有that可以补救下,如果是this的话如果全局变量也有个变量prefix,就出问题了,如果全局变量没有prefix那就是undefined。额,,也会出问题。
  }
  return {getDao:shaZhuDao};//that为该函数的局部变量,也是上下文,可以访问该函数的变量prefix。为了让that这个变量更有用,使用了闭包,即方法返回对象,对象是可以访问方法的私有变量的,方法消亡,方法中的私有变量并不消亡。
}
var shaZhu=shaZhuDe("shazhudao");
shaZhu.getDao("shaniudao");//结果是'shazhudao shaniudao'

3.构造器调用模式

javascript是一门基于原型继承的语言。这意味着对象可以直接从其他对象继承属性。该语言是无类别的。
如果在一个函数前面带上new来调用,那么将创建一个隐藏连接到该函数的prototype成员的新对象,同时this将会被绑定到那个新对象上。new前缀也会改变return语句的行为。
var Quo = function(string){
    this.status=string;
   }
Quo.prototype.get_status = function(){
    return this.status;
}
//构造一个Quo实例该实例的status属性也是可以通过外部访问的所以get_status方法纯粹是画蛇添足。
var myQuo=new Quo("confused");//既然是外部可以直接访问的,为什么还要额外添加一个函数来提供访问的入口呢?
document.writeln(myQuo.get_status());
document.writeln(myQuo.status);
//var quo=Quo("confused");//我们用这个quo来引用没有new前缀的构造函数它只是执行了一遍,并没有返回任何值
//document.writeln(quo.get_status());//这里浏览器将不会输出任何内容了,quo并不是对象。这就给我们造成了困惑。
借此,我们引出apply模式。

4.Apply模式

Apply方法让我们构建一个参数数组,并用其去调用函数。它也允许我们选择this的值。apply方法接收两个参数,第一个是将被绑定给this的值。第二个就是一个参数数组。

举个例子:

var shaZhuDe=function(dao){

  this.dao=dao;

}

shaZhuDe.prototype.shenmeDao=function(){

  return this.dao;

}

var shaNiuDe={

  dao:'牛刀';

};

var dao = shaZhuDe.prototype.shenmeDao.apply(shaNiuDe);

暴力吧,现在杀猪的可以用牛刀了这里是把this绑定到shaNiuDe上面了,shenmeDao这个方法就调用shaNiuDe这个对象里面的字面量dao。

为了更加直观地看到这一点,再写个例子:
var dao="i am ok";//这个status是全局变量
var dao3=shaZhuDe.prototype.shenmeDao.apply(this);//把函数上下文绑定到this,即全局
alert(dao3);//显示:i am ok

显示结果如下:

看起来像便魔术,用的多了就习惯了。

总结下,apply模式是否可以看成这样呢?

javascript看成是外层的大方法,该方法中有:全局变量(可看成方法中的私有变量),其他的像array,document,自定义的对象都是对对象的定义,大方法中还有方法function ss(){},也有对方法的引用比如var sss=function(){};也有new出来的对象,比如var quo=new Object();

Object,array,document,都是名副其实的function,而且它们之中也包含着子方法(function),和它们自己的私有变量。

那么,传入上下文和参数就是在某一个方法(function)中传入上下文和需要的参数了。上下文是为了方法中可能会调用this的私有变量,参数就不多说了,一切都是为了方法能够完成功能啊。

有没有感觉到javascript中一切皆方法啊?额,,跑题了。

javascript的笔记的更多相关文章

  1. JavaScript基础笔记二

    一.函数返回值1.什么是函数返回值    函数的执行结果2. 可以没有return // 没有return或者return后面为空则会返回undefined3.一个函数应该只返回一种类型的值 二.可变 ...

  2. JavaScript基础笔记一

    一.真假判断 真的:true.非零数字.非空字符串.非空对象 假的:false.数字零.空字符串.空对象.undefined 例: if(0){ alert(1) }else{ alert(2) } ...

  3. Java程序猿的JavaScript学习笔记(汇总文件夹)

    最终完结了,历时半个月. 内容包含: JavaScript面向对象特性分析,JavaScript高手必经之路. jQuery源代码级解析. jQuery EasyUI源代码级解析. Java程序猿的J ...

  4. javascript - 工作笔记 (事件四)

    在javascript - 工作笔记 (事件绑定二)篇中,我将事件的方法做了简单的包装,  JavaScript Code  12345   yx.bind(item, "click&quo ...

  5. Java程序猿的JavaScript学习笔记(8——jQuery选择器)

    计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...

  6. Java程序猿JavaScript学习笔记(2——复制和继承财产)

    计划和完成在这个例子中,音符的以下序列: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaSc ...

  7. Java程序猿的JavaScript学习笔记(3——this/call/apply)

    计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...

  8. 你不知道的JavaScript上卷笔记

    你不知道的JavaScript上卷笔记 前言 You don't know JavaScript是github上一个系列文章   初看到这一标题的时候,感觉怎么老外也搞标题党,用这种冲突性比较强的题目 ...

  9. Java程序猿JavaScript学习笔记(4——关闭/getter/setter)

    计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...

  10. Java程序猿JavaScript学习笔记(14——扩大jQuery UI)

    计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...

随机推荐

  1. [WPF] 动画Completed事件里获取执行该动画的UI对象

    原文:[WPF] 动画Completed事件里获取执行该动画的UI对象 昨天群里有位童鞋提出如何在动画完成事件Completed里获取到执行该动画的UI对象. WPF里动画的Completed的本身并 ...

  2. 浅谈 js 字符串 trim 方法之正则篇

    原文:浅谈 js 字符串 trim 方法之正则篇 关于 trim 其实没啥好说的,无非就是去除首位空格,对于现代浏览器来说只是简单的正则 /^\s+|\s+$/ 就可以搞定了.而且支持中文空格   等 ...

  3. 记录近期小改Apriori至MapReduce上的心得

    ·背景 前一阵,一直在研究一些ML的东东,后来工作关系暂停了一阵.现在继续把剩下一些热门的算法再吃吃透,"无聊+逗比"地把他们搞到MapReduce上.这次选择的入手对象为Apri ...

  4. MVC验证04-自定义验证规则、日期范围验证

    原文:MVC验证04-自定义验证规则.日期范围验证 本文体验范围验证.与本文相关的包括: MVC验证01-基础.远程验证   MVC验证02-自定义验证规则.邮件验证   MVC验证03-自定义验证规 ...

  5. TDD(测试驱动开发)学习二:创建第一个TDD程序

    本节我们将学习一些测试驱动开发环境的搭建,测试驱动开发概念和流程.所涉及的内容全部会以截图的形式贴出来,如果你也感兴趣,可以一步一步的跟着来做,如果你有任何问题,可以进行留言,我也会很高兴的为你答疑. ...

  6. 天体程序猿叹息——变化hosts对

    没有解释更新一SDK像贼,我真诚地希望在天上Android.ios我们已经禁止了.要玩不能玩才最寂寞 安装成功不寂寞hosts文件: 74.125.237.1 dl-ssl.google.com173 ...

  7. Monkey源码分析之事件注入

    本系列的上一篇文章<Monkey源码分析之事件源>中我们描述了monkey是怎么从事件源取得命令,然后将命令转换成事件放到事件队列里面的,但是到现在位置我们还没有了解monkey里面的事件 ...

  8. .NET 开源了,Visual Studio 开始支持 Android 和 iOS 程序编写并自带 Android 模拟器

    .NET 开源了,Visual Studio 开始支持 Android 和 iOS 程序编写并自带 Android 模拟器 北京时间今天凌晨的 Connect(); 大会上,多少程序员的假想成为现实. ...

  9. 【SSRS】入门篇(一) -- 创建SSRS项目

    原文:[SSRS]入门篇(一) -- 创建SSRS项目 在本篇中,您将学习如何在 SQL Server Data Tools (SSDT) 中创建报表服务器项目. 报表服务器项目用于创建在报表服务器中 ...

  10. WebIM(3)----性能测试

    WebIM系列文章 在一步一步打造WebIM(1)和(2)中,已经讨论了如何开发一个WebIM,并且使用缓存来提高WebIM的性能,本文将编写一个程序模拟大量用户登录来对WebIM进行性能测试. 1. ...