当前位置:首页 > Web开发 > 正文

第四步:在这个新开辟的作用域中自上而下执行

2024-03-31 Web开发

一千个读者,有一千个哈姆雷特。

此系列文章将会从函数的执行机制、鲁棒性、函数式编程、设计模式等方面,全面论述如何通过 JavaScript 编写高质量的函数。

一、引言

如何通过 JavaScript 编写高质量的函数,这是一个很难回答的问题,差别人心中对高质量有本身的看法,这里我将全面的论述我小我私家对如何编写高质量函数的一些看法。看法可能不够全面,也可能会有一些错误的见解,欢迎一起讨论,就像过日子的人,小吵小闹总会不经意的呈现,一颗包容的心莫过于是最好的 best practice 。

我筹算用几篇文章来完成《如何编写高质量的 JS 函数》 这个系列。

主要从以下几个方面进行论述:

函数(一切皆有可能)

函数的定名

函数的注释

函数的庞大度

函数的鲁棒性(防御性编程)

函数的入参和出参(返回)

如何用函数式编程买通函数的任督二脉

如何用设计模式让函数如虎添翼

编写对 V8 友好的函数是一种什么 style

前端工程师的函数狂想录

本篇只说第一节 函数 ,擒贼先擒王,下面我们来盘一盘函数的七七八八。

二、函数(一切皆有可能)

函数二字,代表着一切皆有可能。

我们想一下:我们用的函数究竟离我们有多远。就像打麻将一样,你感受你能像雀神那样,想摸啥就来啥么(夸张修辞手法)。

天天和函数打交道,函数呈现的目的是什么?再深入想,函数的执行机制是什么?下面我们就来简单的分析一下。

1、函数呈现的目的

函数是迄今为止发现出来的用于节约空间和提高性能的最重要的手段。

PS: 注意,没有之一。

2、函数的执行机制

有句话说的好,知己知彼,百战不殆。想要胜利,必然要非常的了解仇敌。JS 必定不是仇敌啦,但是要想掌握 JS 的函数,要更轻松的编写高质量的函数,那就要掌握在 JS 中函数的执行机制。

怎么去解释函数的执行机制呢?

先来仿照一道前端面试题:输入一个 url 后,会产生什么?

执行一个函数,会产生什么?

参考下面代码:

function say() { let str = ‘hello world‘ console.log(str) }

这道面试题要是交给你,你能答出几多呢?

如果让我来答,,我大抵会这样说:

首先我会创建一个函数。如果你学过 C++ ,可能会说我要先斥地一个堆内存。

所以,我会从创建函数到执行函数以及其底层实现,这三个条理进行分析。

(1)创建函数

函数不是平白无故孕育产生的,需要创建。创建函数时会产生什么呢?

第一步:斥地一个新的堆内存

每个字母都是要存储空间的,只要有数据,就必然得有存储数据的处所。而计算机构成道理中,堆允许措施在运行时动态地申请某个巨细的内存空间,所以你可以在措施运行的时候,为函数申请内存。

第二步:创建一个函数 say ,把这个函数体中的代码放在这个堆内存中。

函数体是以字符串的形式放在堆内存中的。

为什么呢?我们来看一下 say 函数体的代码:

let str = ‘hello world‘ console.log(str)

这些语句以字符串的形式放在堆内存中对照好,因为没有规律。如果是东西,由于有规律,可以凭据键值对的形式存储在堆内存中。而没规律的凡是都是酿成字符串的形式。

第三步:在当前上下文中声明 say 函数(变量),函数声明和界说会提升到最前面

注意,当前上下文,我们可以理解为上下文仓库(栈),say 是放在仓库(栈)中的,同时它的右边还有一个堆内存地点,用来指向堆中的函数体的。

PS: 建议去学习一下数据布局,栈中的一块一块的,我们称为帧。你可以把栈理解中 DOM 树,帧理解为节点,每一帧( 节点 )都有本身的名字和内容。

第四步:把斥地的堆内存地点赋值给函数名 say

这里关键是把堆内存地点赋值给函数名 say 。

下面我画了一个简单的示意图:

结合上图 say 右边的存储,再去理解上面的四个法式,是不是有点感悟了呢。

(2)你真的懂赋值这个操纵吗?

这里提到赋值操纵。我把堆内存地点赋值给函数名 say 意味着什么呢?

赋值操纵是从计算机构成道理角度看,内存分为好几个区域,好比代码区域,栈区域,堆区域等。

这几个区域每一个存储空间的内存地点都是不一样。也就是说,赋值(引用类型)的操纵就是将堆区域的某一个地点,通过总线管道流入(复制)到对应栈区域的某一个地点中,从而使栈区域的某一个地点内的存储空间中有了引用堆区域数据的地点。业界叫句柄,也就是指针。只不过在高级语言中,把指针隐藏了,直接用变量取代指针。

温馨提示: 本文由Jm博客推荐,转载请保留链接: https://www.jmwww.net/file/web/32198.html