Javascript中函数的四种调用方式
一、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中函数的四种调用方式的更多相关文章
- javascript中函数的四种调用模式详解
介绍函数四种调用模式前,我们先来了解一下函数和方法的概念,其实函数和方法本质是一样,就是称呼不一样而已.函数:如果一个函数与任何对象关系,就称该函数为函数.方法:如果一个函数作为一个对象属性存在,我们 ...
- JS高级. 06 缓存、分析解决递归斐波那契数列、jQuery缓存、沙箱、函数的四种调用方式、call和apply修改函数调用方法
缓存 cache 作用就是将一些常用的数据存储起来 提升性能 cdn //-----------------分析解决递归斐波那契数列<script> //定义一个缓存数组,存储已经计算出来 ...
- js函数的四种调用方式以及对应的this指向
一.函数调用,此时this是全局的也就是window 1 var c=function(){ 2 alert(this==window) 3 } 4 c()//true 二.方法调用 var myOb ...
- JavaScript高级之函数的四种调用形式
主要内容 分析函数的四种调用形式 弄清楚函数中this的意义 明确构造函对象的过程 学会使用上下文调用函数 了解函数的调用过程有助于深入学习与分析JavaScript代码. 本文是JavaScript ...
- javascript中this的四种用法
javascript中this的四种用法 投稿:hebedich 字体:[增加 减小] 类型:转载 时间:2015-05-11我要评论 在javascript当中每一个function都是一个对象,所 ...
- JS面向对象函数的四种调用模式
函数的四种调用模式 概念 在 js 中,无论是函数, 还是方法, 还是事件, 还是构造器,...这些东西的本质都是函数 函数, 方法, 事件, 构造器,...只是所处的位置不同 这四种模式分别是 函数 ...
- 同步(Sync)/异步(Async),阻塞(Block)/非阻塞(Unblock)四种调用方式
1. 概念理解 在进行网络编程时,我们常常见到同步(Sync)/异步(Async),阻塞(Block)/非阻塞(Unblock)四种调用方式: 同步/异步主要针对C端: 同步: ...
- 函数的四种调用模式.上下文调用.call.apply
闭包:函数就是一个闭包,一个封闭的作用域; 返回函数,要返回多个函数就用一个对象封装一下, 立即执行函数+return 回调函数 JS动态创建的DOM,不会被搜索引 ...
- 【温故知新】——原生js中常用的四种循环方式
一.引言 本文主要是利用一个例子,讲一下原生js中常用的四种循环方式的使用与区别: 实现效果: 在网页中弹出框输入0 网页输出“欢迎下次光临” 在网页中弹出框输入1 网页输出“查询中……” 在 ...
随机推荐
- 跳出frameset框架
很多网页都是框架结构的,在很多的情况下会通过按钮点击事件或链接,跳出框架转到其它界面.例如说点击“注销登录”返回到登录界面. 一.通过运行脚本跳出框架有以下几种写法: 1.<script lan ...
- Java 返回一个整数的各个数字之和的一种方法
public static long sumDigits(long n){ long total=0; long number=n; while(number!=0){ total=total+num ...
- Oracle 12C RAC的optimizer_adaptive_features造成数据插入超时
问题分析 使用10046事件追踪方式,直接生成上传时的数据库事件日志进行分析,发现主要区别在于以下两条sql语句在每次长时间上传时都有出现,并且执行用户不是上传用户,而是数据库SYS用户. ***** ...
- cdoj 482 优先队列+bfs
Charitable Exchange Time Limit: 4000/2000MS (Java/Others) Memory Limit: 65535/65535KB (Java/Othe ...
- keil uvision看厌了么?试试Sublime Text吧!
之前用 Sublime Text(以下简称 ST )配置了 C/C++ 开发环境,感觉相当不错,作为编辑器的 ST,编辑代码的功能当然是相当棒的,美中不足的是目前只能编译单个文件,但是用来做些小练习也 ...
- HTML <area> 标签 带有可点击区域的图像映射(图像映射指的是带有可点击区域的图像)
例子: <img src="planets.gif" width="145" height="126" alt="Plane ...
- HTTP详解(3)-http1.0 和http1.1 区别
HTTP详解(3)-http1.0 和http1.1 区别 分类: 网络知识2013-03-17 16:51 1685人阅读 评论(0) 收藏 举报 目录(?)[+] 翻了下HTTP1.1的协 ...
- hihoCoder #1301 : 筑地市场 (打表+构造)
题目大意:问含有4或者7的第k大的正数是多少. 题目分析:1~10.1~100.1~1000...之间的含有4或者7的个数可以求出,这样就可以从高位到地位依次确定这个数的每一位上的值. 代码如下: # ...
- Unity Shader播放序列帧动画
Shader "LordShader/AnimateSprite" { Properties { _MainTint (,,,) //颜色属性,可以在u3d inspector面板 ...
- c笔记
关于数组的操作: 初始化: 完全初始化: Int a[5] = {1,3,4,5,6}; 不完全初始化: 未被初始化的元素自动为零 Int a[5] = {1, 3, 4}; 不初始化, 所有元 ...