一、Javascript中函数的几个基本知识点:

1.函数的名字只是一个指向函数的指针,所以即使在不同的执行环境,即不同对象调用这个函数,这个函数指向的仍然是同一个函数。

2.函数中有两个特殊的内部属性:arguments和this.

arguments主要是用来保存函数参数,arguments中的callee属性主要是用来指向拥有当前arguments的函数(理解Javascript参数中的arguments对象).

3.在ECMAScript5中规范了另一个函数属性:caller(Opera早期版本不支持,其他版本浏览器都支持),它的作用是保存调用当前函数的函数的引用.

实例:

function outer() {
inner();
}
function inner() {
console.log(inner.caller);
}
outer();

测试结果:

为了实现更松散的耦合,在inner()方法中同样可以利用arguments.callee.caller来访问,得到的结果和上面的结果一样.

4.在ECMAScript5中还定义了arguments.caller,它主要是用来区别函数中的caller属性。在非严格模式下,arguments.caller得到的值都是undefined;在严格模式下,下面的三种情况都会报错:

"use strict"
function outer() {
inner();
}
function inner() {
//console.log(inner.caller);//报错
//console.log(arguments.caller);//报错
//console.log(arguments.callee.caller);//报错
}
outer();

  

5.函数是个对象,因此它有属性和方法:每个函数都包括两个属性:length、prototype.通过函数名直接调用length,可以得到函数形参的个数;prototype是原型属性,每个函数都会有一个原型属性,更多关于原型属性的内容:理解javascript中的原型模式. 每个函数都包含两个非继承来的方法:apply()和call()(apply()和call()的区别).

二、四种调用函数的方式:函数调用模式、方法调用模式、构造器模式、apply\call模式.

1.直接调用函数的方式,this指向的全局对象window.

实例1:

函数声明

function add(a,b) {
return a+b;
} console.log(add(1,2));

实例2:

函数表达式

var add=function (a,b) {
return a+b;
} console.log(add(1,2));

2.函数作为对象的方法调用,this指向当前的对象.

实例1:

var o = {
prop: 21,
f:function() {
return this.prop;
}
}; console.log(o.f());

实例2:

var o = {
prop: 21,
}; function f() {
return this.prop;
} o.f = f;
console.log(o.f());//21

3.通过new调用构造器的方式,this指向当前构造函数的原型.

实例1:

返回this对象给o

function MyClass() {
this.a = 21;
} var o = new MyClass();
console.log(o.a);//21

实例2:

如果有return,则返回return的结果,如果没有就会返回this。

function MyClass() {
this.a = 21;
return {a:22};
} var o = new MyClass();
console.log(o.a);//22

4.通过apply或call的方式,这两个的第一参数即this,当第一个参数为null,this指向window;当第一个参数为一个对象,this就指向当前这个对象。

Javascript中函数的四种调用方式的更多相关文章

  1. javascript中函数的四种调用模式详解

    介绍函数四种调用模式前,我们先来了解一下函数和方法的概念,其实函数和方法本质是一样,就是称呼不一样而已.函数:如果一个函数与任何对象关系,就称该函数为函数.方法:如果一个函数作为一个对象属性存在,我们 ...

  2. JS高级. 06 缓存、分析解决递归斐波那契数列、jQuery缓存、沙箱、函数的四种调用方式、call和apply修改函数调用方法

    缓存 cache 作用就是将一些常用的数据存储起来 提升性能 cdn //-----------------分析解决递归斐波那契数列<script> //定义一个缓存数组,存储已经计算出来 ...

  3. js函数的四种调用方式以及对应的this指向

    一.函数调用,此时this是全局的也就是window 1 var c=function(){ 2 alert(this==window) 3 } 4 c()//true 二.方法调用 var myOb ...

  4. JavaScript高级之函数的四种调用形式

    主要内容 分析函数的四种调用形式 弄清楚函数中this的意义 明确构造函对象的过程 学会使用上下文调用函数 了解函数的调用过程有助于深入学习与分析JavaScript代码. 本文是JavaScript ...

  5. javascript中this的四种用法

    javascript中this的四种用法 投稿:hebedich 字体:[增加 减小] 类型:转载 时间:2015-05-11我要评论 在javascript当中每一个function都是一个对象,所 ...

  6. JS面向对象函数的四种调用模式

    函数的四种调用模式 概念 在 js 中,无论是函数, 还是方法, 还是事件, 还是构造器,...这些东西的本质都是函数 函数, 方法, 事件, 构造器,...只是所处的位置不同 这四种模式分别是 函数 ...

  7. 同步(Sync)/异步(Async),阻塞(Block)/非阻塞(Unblock)四种调用方式

    1. 概念理解        在进行网络编程时,我们常常见到同步(Sync)/异步(Async),阻塞(Block)/非阻塞(Unblock)四种调用方式:   同步/异步主要针对C端: 同步:    ...

  8. 函数的四种调用模式.上下文调用.call.apply

    闭包:函数就是一个闭包,一个封闭的作用域;         返回函数,要返回多个函数就用一个对象封装一下,         立即执行函数+return 回调函数   JS动态创建的DOM,不会被搜索引 ...

  9. 【温故知新】——原生js中常用的四种循环方式

    一.引言 本文主要是利用一个例子,讲一下原生js中常用的四种循环方式的使用与区别: 实现效果: 在网页中弹出框输入0   网页输出“欢迎下次光临” 在网页中弹出框输入1   网页输出“查询中……” 在 ...

随机推荐

  1. CSS知识点总结

    1.选择器 参考链接:十分钟搞定CSS选择器-Samaritans  CSS选择器笔记-阮一峰  CSS选择器-w3school  MDN 参考书籍:<CSS高效开发指南> 2.布局 2. ...

  2. Open vSwitch安装及配置

    一. Open vSwitch简介 1.1概述 Open vSwitch是一个高质量的.多层虚拟交换机,使用开源Apache 2.0许可协议,由Nicira Networks开发,主要实现代码为可移植 ...

  3. MBR主引导扇区解析

    最近在制作镜像的时候由于需要简单研究了下MBR主引导扇区的结构,这里记录下便于后期温习,下面就直接进入正题: MBR主引导扇区位于磁盘的第一个扇区,即0号扇区,主要由引导代码.分区表.结束标志三部分构 ...

  4. Context启动startActivity注意

    intent.setFlags()方法中参数的用例: 很多人使用startActivity时候,会碰到如下的异常:Caused by: android.util.AndroidRuntimeExcep ...

  5. (实用篇)微信网页授权(OAuth2.0) PHP 源码简单实现

    提要: 1. 建议对OAuth2.0协议做一个学习. 2. 微信官方文档和微信官网工具要得到充分利用. 比较简单,直接帖源代码了.其中"xxxxxxxxxx"部分,是需要依据自己环 ...

  6. 多个Tomcat同时运行环境配置 - imsoft.cnblogs

    解压下载好的Tomcat压缩包,两次.此例中分别命名为tomcat和tomcat2. 1. 在MyEclipse中配置好第一个Tomcat环境,可以正常运行项目后. 2. 再配置tomcat2这个项目 ...

  7. CSS2伪类选择器要点

    有四个选择器,分别是 hover:鼠标悬停 link:链接不能使用时 visited:链接被点击后 active:链接被点击时,如果鼠标不放,就会一直触发active属性 link在w3c中记录为链接 ...

  8. css 属性积累

    1. letter-spacing:6px;    //属性增加或减少字符间的空白(字符间距) 2. cursor                       // 鼠标移上去的鼠标状态 属性值有: ...

  9. CSS Flex弹性布局

    关于css3的flex布局,阮一峰老师的文章写的清晰易懂又全面,这里附上链接http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html?utm_s ...

  10. Redis是什么?Redis数据库全解?

    Redis是什么 这个问题的结果影响了我们怎么用Redis.如果你认为Redis是一个key value store, 那可能会用它来代替MySQL;如果认为它是一个可以持久化的cache, 可能只是 ...