灵感和一些素材来自某神秘视频网站,信息编码: lkIFF4maKMU。
具体内容如题,列举了作为JS开发者,应该知晓(不一定熟练掌握或深刻理解)的100余个技术概念。 笔者觉得这些内容和组织还是不错的,对于无论是初学者还是有经验的开发者而言,都是一个很好的知识检查清单,用来查漏补缺,有些内容也可以在不同的层面引起一些思考,遂记录以分享。
对应于原始内容,笔者对于其组织进行了优化,部分条目的次序进行了微调。对于每个条目,笔者会基于自己的理解进行简单的解释和点评。笔者会尽量保持简洁精要,但如果觉得确实有必要,也会稍微展开,但应该不会太深入带来阅读负担。
此外,由于内容展开实在过多,本文的全部内容分为了上中下三个部分,只是简单的例举,没有严格的分类和先后逻辑关系。
下面我们开始:
JavaScript,对初学者而言,是一个绝好的语言,也是一门可怕的语言。它可以用于开发任何功能的软件,并且在任何地方都可以运行。
▢ 0x01: Browser, 浏览器
对使用者角度而言,浏览器是一种通用的、标准化的互联网网页和应用的访问工具软件。对于开发者而言,浏览器是Web应用运行的标准化平台和环境。作为人机交互的接口,浏览器已经成为互联网应用技术体系内,最重要的组成部分。
▢ 0x02: HTML, 超文本标记语言
浏览器软件用于页面内容结构组织、布局和呈现所使用的标准化语言和规范。HTML语言本质上是XML(Extendable Mark Language)的一个特定的功能化子集。XML的特点是使用文本标签(尖括号围起来的文本)对信息进行标记。标签名称可以自己定义,并且可以嵌套,可以表达层次化和有结构的数据和信息。XML是全文本化的,可以兼容各种软硬件平台,便于网络传输和存储,并方便人理解和编辑。
这些特点,使其得到了广泛的应用,从而作为Web的一个重要标准(图为HTML语法和结构)。
▢ 0x03: High-Level Language, 高级语言
高级语言(High-level Language)是相对于低级语言而言的,它通常指抽象层次较高、接近自然语言、更方便应用的开发和在不同的硬件平台上移植和运行的编程语言。
虽然从运行效率而言,高级语言无法同低级语言如汇编相比,但从软件工程总体的角度,高级语言通过提供抽象和封装,简化了编程工作,大大提高了软件开发效率,是现代编程语言的主流选择。
▢ 0x04: ECMAScript
ECMA(European Computer Manufacturers Association,欧洲计算机制造商协会),是一个国际标准化组织。ECMAScript是由其领导制定的JavaScript语言标准和规范。只有规范和一致性,才能保证JS在不同的运行环境中都能够正常运行。当前的主流版本是ES6。
▢ 0x05: Web Assembly, Web装配
WebAssembly(缩写Wasm)是为日益复杂的Web应用而开发的新的编码和执行方式,它可以在现代浏览器环境中执行,但和JavaScript解释性的工作方式不同,采用类似原生机器码的指令集,能够充分利用硬件性能,同时具有很好的安全并、跨平台和可移植性。WASM有潜力可以应用于如游戏、高性能计算等原来普通Web应用不适合的应用场景。
▢ 0x06: RunTime, 运行时
现代化的很多高级语言,考虑到兼容运行的情况,一般都不能自己直接运行,而是需要一个系统和支持的环境,它可以抽象并隔离底层的硬件和操作系统,为程序执行提供标准化和必要的基础设施和功能。这种环境通常被统称为Runtime(运行时)。如Java、JS、Python、PHP等语言都有自己配套的Runtime(图为js runtime构成)。
▢ 0x07: Scripting Language, 脚本化语言
脚本化语言(Scripting Language)是一类侧重于编写脚本程序的编程语言,和普通传统的编译型语言如C相比,它一般不需要编译,可以快速方便的解释执行,此外它的语法设计更接近自然语言,内置了常用任务功能,移植性和扩展性好,开发-测试-部署方便。适合于完成快速、小型、特定类型的任务。典型的脚本语言包括JavaScript、Python、Ruby、Shell、PHP等。
▢ 0x08: Dev Tools: 开发工具
帮助开发者编写、执行、调试程序所使用的软件。这个程序可以是一个独立的集成开发工具(IDE),如 VSCode,但现代浏览器一般也集成可以直接进行Web应用调试的功能模块。如Chrome Develper Tools(图)。
▢ 0x09: Interpreted,解释
解释执行(Interpretation)是一种程序运行的方式。程序运行时,由另外一个解释器程序,依次读取程序代码,在内部理解处理,实时翻译为当前系统可执行的代码后执行。对于使用者而言,它简化了原来程序执行所需要的编译、连接等步骤,更加灵活和方便,但通常相对而言性能和效率比原生程序要低。
▢ 0x0A: JS Engine, JS执行引擎
一类负责JavaScript代码的加载、解释、执行和优化的软件系统。典型的JS Engine包括V8、Spider、JavascriptCore等等。
和运行时相比,执行引擎的概念更狭义和具体一点,或者可以说,执行引擎一般是运行时的一个组成部分。
▢ 0x0B: Just-In-Time Complication,即时编译
JIT本质上是一种高效的工作组织理念和方法。强调工作流程的合理划分、前后衔接顺畅、资源合理使用。用在程序执行上,以V8的JIT编译为例,它强调程序快速启动,代码片段和模块化,只编译执行部分,边编译边执行边优化,而且这一过程是自动化的,从而达到了较高的整体开发和执行效率。
图中的丰田汽车生产线的组织管理,就是JIT理念和实践的最佳范例。
▢ 0x0C: Script Tag,脚本标签
HTML中,需要使用script标签,来标识js代码,告知浏览器标签所标识的内容是程序脚本,而非普通的HTML文本内容,称为脚本标签。
▢ 0x0D: SRC Attribute, 源属性
在HTML中,除了直接使用脚本标签提供JS代码之外,还可以引用外部的JS程序,需要在脚本标签内,使用SRC属性,指定所引用的程序代码的URL地址。这一特点可以方便JS代码重用和模块化。
▢ 0x0E: Console Log, 控制台日志
控制台console,通常是程序的运行时环境提供的一种在程序运行时输出并显示信息的一种机制。目的是辅助监控程序的运行状态或者帮助程序调试,这也是一个成熟的开发体系的常用功能和做法。无论在前端浏览器和后端的nodejs环境中,都可以使用console对象和console.log方法,向默认的控制台输出可定制用于监控和调试的信息,通常被称为日志。在浏览器中,控制台在其附带的开发工具中(图);而在nodejs中,控制台就是其执行程序的终端命令行环境。
▢ 0x0F: Var, 变量声明
var是传统的用于变量声明的关键字。var通常适用于全局变量,所以使用时要比较谨慎,避免冲突和全局命名空间污染。一般情况下建议优先使用比较新的let而非var。
▢ 0x10: Let, 变量声明
let是js用于变量声明的关键字。和var声明相比,let的出现比较新,它主要用于块级变量声明和局部变量,相对而言let更加安全,被建议优先使用。
▢ 0x11: Const,常数
const关键字,可以用于声明和定义一个常数。常数的值不能修改。由于编译器可以优化常数操作,合理使用常数可以提高执行效率和降低资源占用。
▢ 0x12: CamelCase,驼峰命名风格
一种变量命名的拼写风格。就是变量名有多个单词构成的时候,首字母小写,其他各单词的首字母大写,直接连接无连接字符。如theFunnyMovie。
▢ 0x13: Dynamically Typed,动态类型
JS是一种动态类型的语言,意思是在javascript中变量的类型可以变化和转换,这样可以简化程序编写,但也带来了在程序运行时,数据类型处理和变化的导致的程序错误和执行效率降低的风险。
▢ 0x14: Primitive, 基本数据类型
JS的基本数据类型包括字符串string、数字number、大整数bigint、布尔boolean、未定义undefined、符号symbol和空null等七种类型。
▢ 0x15: Undefined, 未定义
undefined是JS变量未明确赋值前的初始值。
▢ 0x16: Null,空
空值,可以将变量强制赋为空值。在JS中,null和undefined两个概念。
▢ 0x17: String,字符串
在各种编程语言中,通常都使用字符串来表示文本信息,它是一种数据结构和文本信息的组织方式。js中,字符串由一对双引号或者单引号围起的文本信息(字符串内容)来表示,并提供了一套相关的机制和方法可以对其进行高效的操作。
从使用的角度来看,字符串就是一个有序的文本信息的集合;但从编程的角度来看,情况可能会复杂很多。这里没有简单的使用"字符"这个名词,是因为涉及需要支持复杂多样的自然语言文字,以及和其他形式的信息如数据类型进行转换,这样还会带来一套字符串编解码和字符集系统。js默认的字符串编码使用UTF-8,它可以支持全球统一通用的语言和文字。
▢ 0x18: Object,对象
对象,是面向对象编程方法的核心概念。对象是试图模拟和映射现实实体而建构的抽象的数据类型和结构。对象包括了属性(状态)、行为、标识和类型等特征,并通过封装、继承和多态性等操作,在程序系统内就可以灵活地对真实世界进行建模和抽象。
使用对象和面向对象的编程方式的主要目的,是为了在工程上将编程活动具象化,并能够降低代码重用、移植和集成的难度,提高应用系统的开发效率和可维护性。
▢ 0x19: Simicolons,分号
JS使用分号,通常作为语句终止符或者代码块分隔符。这个分隔符在js中不是必须的,但如果省略,可能会造成一些逻辑问题。
▢ 0x1A: Lexical Environment, 词法环境
词法环境是JavaScript中一个非常重要的概念,它描述了代码在执行过程中变量和函数的查找规则,每个运行的函数都有一个词法环境。由于原来JS并不是类型和引用非常严格的编程语言,当需要一个变量时,它会使用词法环境来从内到外逐级查找变量。程序的基础词法环境,就是全局上下文(图)。
▢ 0x1B: Global Scope, 全局作用域
JavaScript中,全局作用域就是最外层和基础的作用域,在此域中声明的变量和函数就是全局变量和全局函数,全局可见和可用,并且在程序运行的生命中永久存在。
所以,使用全局作用域和全局变量要特别小心,容易造成命名冲突和数据污染的状态,资源占用和成本和很高。特别是原来的js版本中,未声明的变量自动称为全局变量,但在ES6,引入了模块语法和局部作用域,可以改善全局作用域可能造成的潜在问题。
▢ 0x1C: Local Scope, 局部作用域
和全局作用域相对的,局部作用域,指的是由函数创建的作用域,用于组织函数内部的变量访问规则和逻辑。
变量查找只能在一个有限的范围内有效。
▢ 0x1D: Block Scope, 块作用域
块作用域在ES6中引入,由代码块({})创建和定义,用于组织局部内部的变量访问逻辑。可以在局部作用域内独立工作。
▢ 0x1E: Hoisting, 提升
变量和函数的提升(hoisting)是JavaScript中的一种执行前的预处理机制。它原来是为了解决在变量或者函数在声明前不能使用的问题。提升的意思是,代码执行时,函数和变量的声明,会在执行时,提升到作用域顶部,这样,无论源代码中,声明是否在调用和使用前,变量和函数都可以正常使用。
提升是执行引擎的一种隐式操作,正确的理解和使用,对理解程序执行中出现的一些问题可能会有帮助。
本章节的内容暂时到这里,其他内容参考系列中的后续章节。