第四章 函数(JavaScript:语言精粹)
myzbx 2025-09-04 13:55 8 浏览
函数包含一组语句,用来指定对象的行为,其代码可以用来重复使用。
一般来说,编程就是将一组需求分解成一组函数和数据结构的技能。
概览:函数对象 | 函数字面量 | 调用 | 方法调用模式 | 函数调用模式 | 构造函数调用模式 | Apply 调用模式 | 参数
4.1. 函数对象
JavaScript 中的函数就是对象。
对象字面量产生的对象连接到 Object.prototype,函数对象连接到 Function.prototype(该原型对象本身连接到 Object.prototype)。
函数的与众不同之处在于它们能被调用。
4.2. 函数字面量
函数对象通过函数字面量来创建。
// 4.2 code 1 var add = function (a, b) { return a + b; };
函数字面量分为 4 个部分:第 1 部分,是保留字 function;第 2 部分,是函数名,它可以省略,省略函数名的函数称为匿名函数;第 3 部分是包含在圆括号中的一组参数;第 4 部分是包围在花括号中的一组语句,是函数的主体,在函数被调用时执行。
函数也可以被定义在其他函数中。一个内部函数除了可以访问自己的参数和变量,同时也能自由访问把它嵌套在其中的父函数的参数和变量。这被称为闭包。
4.3. 调用
除了函数声明时定义的形式参数,每个函数还接收两个附加的参数:this 和 arguments。this 的值取决于调用的模式。
在 JavaScript 中一共有四种调用模式:方法调用模式、函数调用模式、构造器调用模式、apply 调用模式。
4.4. 方法调用模式
当一个函数被保存为对象的一个属性时,我们称它为一个方法。当一个方法被调用时,this 被绑定到该对象。
// 4.4 code 2 var myObj = { value: 0, increment: function (inc) { this.value += typeof inc === 'number' ? inc : 1; } }; myObj.increment; myObj.value // 1 myObj.increment(2); myObj.value // 3
通过 this 可取得它们所属对象的上下文的方法称为公共方法,代码里 increment 方法就是公共方法。
4.5. 函数调用模式
当一个函数并非一个对象的属性时,那么它就被当作一个函数来调用的。
// 4.5 code 3 var sum = add(3, 4); // 7
以此模式调用函数时,this 被绑定到全局变量,也就是 window 对象。
// 4.5 code 4 myObj.double = function { var helper = function { this // Oops, window Object! } }
↑这是一个语言设计上的错误,内部函数 helper 的 this 指 window,根本不是外部函数 double 指的 myObj 对象。可以这样解决:
// 4.5 code 5 myObj.double = function { var that = this; var helper = function { that.value = add(that.value, that.value); } helper; // Function Invocation } myObj.double; // Method Invocation myObj.value // 6
将外部函数的 this(也就是 myObj 对象),赋值给变量 that,那么在内部函数里就可以使用 myObj 对象了。
4.6. 构造器调用模式
JavaScript 是一门基于原型继承的语言,这意味着对象可以直接从其他对象继承属性,通过 prototype 属性。这偏离了当前编程的主流风格(基于类的编程),并没有被广泛理解。
一个函数,如果创建的目的就是希望给 new 前缀来调用,那么它就被称为构造器函数。
// 4.6 code 6 var Quo = function (str) { this.status = str; } Quo.prototype.get_status = function { return this.status; } var quo1 = new Quo('online'); quo1.get_status // "online"
你可能会看到,当一个函数当成构造器函数使用时,函数名遵循大写约定(比如是 Quo,而不是 quo)。
我不推荐使用这种形式的构造器函数。下一章会有更好的替代方式。
4.7. Apply 调用模式
JavaScript 的函数可以拥有方法。
Apply 调用模式要用到 Function.prototype.apply(thisArg, argArray)方法,第一个参数是绑定给 this 的值,第二个参数是一个参数数组。
// 4.7 code 7 var arr = [3, 4]; var sum = add.apply(null, arr); sum // 7 var statusObj = { status: 'offline' }; var status = Quo.prototype.get_status.apply(statusObj); status // "offline"
结合上面的代码,我们对 apply 方法的两个参数,再做些说明,以便加深我们的印象:
1. add.apply(null, array):null 表示函数 add 里的 this 值为 null,array 数组里提供了调用 add 函数时可以传递给它的两个参数,这里分别是 3 和 4,所以 sum 的值是 7。
2.
Quo.prototype.get_status.apply(statusObj):因为我们将 statusObj 绑定到了 get_status 方法的 this 上,相当于可以在 statusObj 上调用 get_status 方法。虽然 statusObj 没有 get_status 方法,也并没有继承 Quo.prototype。第二个参数没赋值,因为调用 get_status 方法不需要参数的。
4.8. 参数
(待续...)
相关推荐
- 微信又双叒叕更新了!这次是安卓版
-
澎湃新闻综合报道近日安卓版微信正式更新了8.0.10版主要有四大更新日常使用起来会更加方便一起来看看吧1朋友圈视频封面在此之前,朋友圈背景一直只能放静态图片,但此次更新后,可以从视频号中选择一段...
- 镜子里的你和照片里的你,哪个更真实?
-
不知道大家有没有这样的经历。聚餐、团建……一群人拍合照,拍完之后,我们满心期待地放大照片,却惊慌失措地发现——怎么自己又被拍得这么丑!但这时,别人总是会说道——「这就是你平常的样子啊。」可是,我们平时...
- 歼20战斗机现身珠海,首次公开静态展示,体现解放军的自信和强大
-
日本航空自卫队在9月份举行了三泽基地开发日活动,期间出动12架F-35A闪电II战斗机进行了公开展示,不过仅仅是编队通场飞过而已。日本航空自卫队仅仅动用1架F-35A战斗机进行了机动飞行表演,从公开的...
- Java类初始化阶段深度解析:执行顺序与线程安全
-
一、初始化阶段核心机制二、分步详解与代码验证1.初始化触发条件主动使用场景:publicclassInitTrigger{static{System.out.pr...
- 深入剖析 Java 类加载机制:原理、优化与实践
-
作为Java开发者,你是否遇到过这样的场景:线上服务突然抛出NoClassDefFoundError,但本地调试却一切正常;或者明明引入了依赖JAR,却始终报ClassNotFoundExcep...
- SUID/SGID是啥?如何让普通用户拥有root的能力?
-
原文链接:「链接」在Linux系统中,权限控制是一项至关重要的安全机制。除了常见的r(读)、w(写)和x(执行)权限外,还有三种特殊权限位常被忽视:SUID(SetUserID)、SGID...
- 数码宝贝新世纪:SP奥米加兽AS情报泄露,是否也是强力辅助?
-
大家好!我是小飉[liáo],欢迎来阅!情怀手游《数码宝贝新世纪》官方不按套路出牌,这次公布的入围测试的人员名单,但是并没有公布SP奥米加兽AS的能力情报,还好广大网友给力。次日,在论坛,以及...
- 抽象类(abstract class)与接口(interface)
-
A.核心概念1.抽象类-定义:带有abstract修饰符的类,不能被实例化,用于定义一组方法签名和可选的部分公共实现。-特性:-可以包含字段、构造函数、已实现的方法(带方法体)和抽象方法(...
- S39结束时间确定,新赛季段位继承公布,大量皮肤在7月初集体上线
-
文/静海君如果说之前都还是猜测的话,那游戏内的一个变动,基本100%确定了新赛季(S40)的开启时间。新赛季的开启时间关于新赛季的开启时间,目前主要有两个线索。第一个关于新赛季开启时间的线索是「游戏内...
- 一篇文章掌握整个JVM,JVM超详细解析!!!
-
不懂JVM看完这一篇文章你就会非常懂了,文章很长,非常详细!!!先想想一些问题1我们开发人员编写的Java代码是怎么让电脑认识的首先先了解电脑是二进制的系统,他只认识01010101比如我们经常要...
- 项目用 JDK17 后,bug 少了、速度快了!这 4 个好处太实在
-
别再死守JDK8了!去年把电商项目升级到JDK17,团队直接爽翻:代码量少写1/3,大促再也不卡顿,运维半夜不call人,连测试都夸bug少了。今天就说真话,JDK17在项目里的4...
- 法定继承有顺序:在法定继承人中,谁应该优先继承?
-
免费问律师_法律咨询免费24小时律师在线解答-法临网“父母去世没留遗嘱,兄弟姐妹争遗产闹上法庭!”法定继承中,谁优先拿财产?《民法典》明确“顺序+份额”规则,一文说清关键点,避免家庭内耗!一、法定...
- 前端必会:ES5寄生继承 vs ES6 Class继承
-
大家好,我是谦!说到继承,估计不少前端开发者都踩过坑。尤其是在ES5到ES6的过渡阶段,我们写代码时常常被问到:“你用的是原型继承还是Class继承?”再加上面试官特别喜欢追问底层实现——...
- 子女入了外籍能否继承父母国内的房产呢?
-
大家好,这里是家理范律,专注遗产继承、婚姻家事领域!-很多加入外籍的朋友都纠结:自己还能继承国内父母的房产吗?答案是可以继承,但流程远比想象复杂!-真实案例:美籍华人张先生,拿着父母在加州公证的遗嘱回...
- J.A.C.S | 基于化学类型和靶点的基因组挖掘以寻找一种新的细菌肽脱甲酰酶天然产物抑制剂
-
大家好,今天推送的文章是2025年6月发表在JournaloftheAmericanChemicalSociety上的“Chemotype-andTarget-DrivenGenome...
- 一周热门
- 最近发表
- 标签列表
-
- HTML 简介 (30)
- HTML 响应式设计 (31)
- HTML URL 编码 (32)
- HTML Web 服务器 (31)
- HTML 表单属性 (32)
- HTML 音频 (31)
- HTML5 支持 (33)
- HTML API (36)
- HTML 总结 (32)
- HTML 全局属性 (32)
- HTML 事件 (31)
- HTML 画布 (32)
- HTTP 方法 (30)
- 键盘快捷键 (30)
- CSS 语法 (35)
- CSS 轮廓宽度 (31)
- CSS 谷歌字体 (33)
- CSS 链接 (31)
- CSS 定位 (31)
- CSS 图片库 (32)
- CSS 图像精灵 (31)
- SVG 文本 (32)
- 时钟启动 (33)
- HTML 游戏 (34)
- JS Loop For (32)