文档章节

深入理解javascript函数调用

bosscheng
 bosscheng
发布于 2014/12/15 22:14
字数 951
阅读 417
收藏 47

概述

 调用一个函数会暂停当前函数的执行,传递控制权和参数给新的函数。

 除了声明的时候定义的形参,每个函数还会接受两个参数this和arguments,

 参数this在面向对象编程中非常重要,他的值取决于调用的模式。

 在javascript中一共有四种调用模式


 对于调用运算符,是跟在任何生产一个函数值的表达式之后的一对圆括号。圆括号内可以包含一个或者多个用逗号分割开来的

 表达式。每个表达式产生一个参数值。每个参数值被赋予函数声明时定义的形式参数名,当实际参数的个数与形式参数的个数不匹配的时候,

 会导致运行时出错。如果实际参数过多的话,超出的参数值会被忽略,但是如果参数值过少的话,缺少的值会被undefined替代。


 对参数值不会做类型检查:任何类型的值都可以被传递给任何参数。


方法调用模式 the method invocation pattern

        当一个函数被保存作为对象的一个属性的是,那就变成了一个方法。当一个方法被调用的时候,this被绑定到这个对象上面。

        通过'.'来调用这个方法。

 方法可以使用this访问自己所属的对象,所以他能够从对象中取值或者对对象进行修改,this到对象的绑定发生在被调用的时候。

 这个超级延迟绑定使得函数可以对this高度复用。

 通过this可以取得他们所属对象的上下文的方法称之为公共方法。

var myObject = {
    value: 0,
    increment: function (inc) {
        this.value += typeof inc === 'number' ? inc : 1;
    }
}

myObject.increment();
console.log(myObject.value);  // 1
myObject.increment(5);
console.log(myObject.value);  // 6
myObject.increment('4');
console.log(myObject.value);  // 7


函数调用模式 the function invocation pattern

        当一个函数并非一个对象的属性的时候,那么他就可以被当作一个函数来调用

         var sum = add(3,4);

         以此模式调用函数的时候,this被绑定到全局对象。

function add(a, b) {
    return a + b;
}

myObject.double = function () {
    var that = this;
    var helper = function () {
        that.value = add(that.value, that.value);
    }

    // 这个时候this对象执行全局对象。
    helper();  // 以函数的形式调用helper
}

// 以方法的形式调用double
myObject.double();
console.log(myObject.value)  // 14


构造器调用模式 the constructor invocation pattern


 javascript是一门基于原型继承的语言,这意味着对象可以直接从其他对象继承属性,该语言是无类型的。

 如果在一个函数的前面带上new来调用,那么背地里将会创建一个连接到该函数的prototype成员的新对象,

 同时this会绑定到那个新对象上。


 new前缀会改变return 语句的行为。


 对于一个函数,如果创建的目的就是希望结合new前缀来调用,那么他就被称之为构造器函数。


 PS:以大写格式命名。

var Que = function (string) {
    this.status = string;
}

Que.prototype.getStatus = function () {
    return this.status;
}

var myQue = new Que('bosscheng');
myQue.getStatus();   // bosscheng

apply调用模式 the apply invocation pattern

 因为javascript 是一门函数式的面向对象语言,所以函数可以拥有方法

 apply方法让我们构建一个参数数组传递给调用函数。他也允许我们选择this的值。

 apply提供两个参数,一个绑定到this对象上。一个是数组。

var array = [2, 4];

var sum = add.apply(null, array);

var statusObject = {
    status: 'panpan'
}


// 对象 statusObject 并没有继承自Que.prototype,但是我们可以在statusObject  上调用 getStatus 方法。
// 实际上statusObject 是没有getStatus方法的。 但是通过 apply 都实现了。
var status = Que.prototype.getStatus.apply(statusObject); // panpan


© 著作权归作者所有

bosscheng
粉丝 81
博文 303
码字总数 95443
作品 0
南京
前端工程师
私信 提问
Function执行原理 & 闭包

Execution Context 执行期上下文 在java或c语言中,都有块级作用域这个概念,而js中则没有。 在js中,作用域只有一种,即函数级作用域。 而执行期上下文,可以理解为函数的作用域或执行环境。...

烽穹寒渊
2018/07/13
0
0
Function执行原理 & 闭包

Execution Context 执行期上下文 在java或c语言中,都有块级作用域这个概念,而js中则没有。 在js中,作用域只有一种,即函数级作用域。 而执行期上下文,可以理解为函数的作用域或执行环境。...

烽穹寒渊
2016/08/21
0
0
深入理解JavaScript执行上下文和执行栈

前言 如果你是一名 JavaScript 开发者,或者想要成为一名 JavaScript 开发者,那么你必须知道 JavaScript 程序内部的执行机制。执行上下文和执行栈是JavaScript中关键概念之一,是JavaScrip...

浪里行舟
03/18
0
0
JavaScript 对引擎、运行时、调用堆栈的概述理解

JavaScript 对引擎、运行时、调用堆栈的概述理解  随着JavaScript越来越流行,越来越多的团队广泛的把JavaScript应用到前端、后台、hybrid 应用、嵌入式等等领域。 这篇文章旨在深入挖掘Jav...

开元中国2015
2018/10/25
0
0
深入浅出 JavaScript 中的 this

在 Java 等面向对象的语言中,this 关键字的含义是明确且具体的,即指代当前对象。一般在编译期确定下来,或称为编译期绑定。而在 JavaScript 中,this 是动态绑定,或称为运行期绑定的,这就...

idea_biu
2012/09/05
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Qt编写数据可视化大屏界面电子看板9-曲线效果

一、前言 为了编写数据可视化大屏界面电子看板系统,为了能够兼容Qt4和嵌入式linux系统,尤其是那种主频很低的,但是老板又需要在这种硬件上(比如树莓派、香橙派、全志H3、imx6)展示这么华...

飞扬青云
25分钟前
2
0
责任链模式

//这篇博客的博主真的不错,解析的都很清晰明了, https://blog.csdn.net/jason0539/article/details/45091639

南桥北木
51分钟前
3
0
Flutter -------- dio网络请求

dio是Flutter中文网开源的一个强大的Dart Http请求库,支持Restful API、FormData、拦截器、请求取消、Cookie管理、文件上传/下载、超时等... 1.添加依赖# dependencies: dio: 2.1.x #...

切切歆语
今天
1
0
PHP的学习

PHP变量的命名必须以$符开始,如: $i;$j;$name; $符后面的第一个字符不可以是数字,只能是字母或者下划线(_)。 除了下划线(_)之外,变量中不能出现任何特殊字符,也就是变量只能包含...

墨冥
今天
3
0
一篇文章彻底搞懂Java虚拟机

概念: 虚拟机:指以软件的方式模拟具有完整硬件系统功能、运行在一个完全隔离环境中的完整计算机系统 ,是物理机的软件实现。常用的虚拟机有VMWare,Visual Box,Java Virtual Machine(Jav...

骚年锦时
今天
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部