【零基础学JS -3】Javascript学习的前情提要（基础概念 最佳实践 命名约定）

👨‍💻 作者简介：程序员半夏 , 一名全栈程序员，擅长使用各种编程语言和框架，如JavaScript、React、Node.js、Java、Python、Django、MySQL等.专注于大前端与后端的硬核干货分享,同时是一个随缘更新的UP主. 你可以在各个平台找到我!
🏆 本文收录于专栏: 零基础学JavaScript,包含JavaScript 基础知识,DOM相关知识,高级知识点,最新ES特性
————————————————————————
🔥 热门专栏:

🥇 学透CSS: 全网阅读超百万,CSDN最强CSS专栏,精通CSS全属性，不做切图仔，从订阅本专栏开始!

🥇 SprinbBoot + Vue3 项目实战: 新鲜出炉的2023实战系列博客,配套视频,用心打磨,篇篇精品.持续更新,值得订阅!

JavaScript 基础知识

在开始使用 JavaScript 编程之前，有必要从基本的 JavaScript 语言开始探索 JavaScript 基础知识和核心 JavaScript 概念。

JavaScript 最初被称为 Livescript，因为它旨在使网站活跃起来或为其带来交互性。JavaScript 代码被编写为 脚本。因此，用 JavaScript 编写的代码称为脚本。使用 JavaScript 非常简单，因为它不需要任何设置。只需打开一个浏览器窗口并开始编写 JavaScript 代码即可。

在我们深入研究 JavaScript 代码之前，让我们了解一些基本的 JavaScript 术语：

JavaScript 变量

变量是存储值的容器，在 JavaScript 语言中，变量对于创建任何交互式或动态的东西至关重要，因为需要变量来更改值。你使用 var 或 let或const 关键字声明一个变量，然后为该变量赋值。

变量可以保存具有以下不同数据类型的值：

• string 字符串
• number 数字
• boolean 布尔值
• Array 数组
• Objects and symbols 对象和符号

JavaScript 注释

JavaScript 注释是一些简短的文本（作用类似电视剧中的旁白），WEB浏览器会忽略这些文本。你可以像在 CSS 中一样在 JavaScript 中添加注释。它们可用于解释 JavaScript 代码，或者它们用于使代码更具可读性。

JavaScript 运算符

运算符是数学符号，例如加法、乘法、除法和减法，它们根据两个值/变量生成结果。基本的 JavaScript 算术运算符用于对数字执行数学运算，而 JavaScript 赋值运算符为 JavaScript 变量赋值，JavaScript 比较运算符确定变量或值之间的相等或不同，而 JavaScript 字符串运算符可用于连接字符串。

JavaScript 条件

JavaScript 中的条件语句是用于针对不同条件执行不同操作的代码结构。条件语句通常用于测试表达式是否返回 true。最常见的示例是 if … else 语句。if … 语句扫描括号中的条件，如果结果为真，则执行代码块。

函数

JavaScript 函数是你希望重用的代码块，这样你就不必一遍又一遍地编写相同的代码。你可以将代码主体定义为函数，只要调用它就可以执行。

如果你看到看起来像变量名后跟圆括号的内容，则它可能是一个函数。括号内包含参数，如果有多个则用逗号分隔。

JavaScript 事件

要在网站上实现交互元素，你需要事件处理程序，它运行代码以响应浏览器中的活动。当在 HTML 页面中使用 JavaScript 代码时，JavaScript 会对这些事件做出反应。JavaScript 中 HTML 页面上的事件示例包括单击按钮、将信息输入输入字段或完成加载过程的网页。

HTML 事件包括用户和浏览器的操作。

JavaScript 表达式

编写代码时可能的最小结构称为表达式。表达式可以是任何值，也可以是一段代码中的结果。 2 + 3 是一个表达式，因为它产生的值是 5。

JavaScript 语句

语句基本上可以与表达式互换。但是，在这种情况下，语句更多的是指示浏览器执行任务或执行操作的指令或一行代码。 result = 2 + 3 是一个语句，因为它不一定会产生一个值，但它会指示浏览器将该值存储 5 在一个名为 的变量中 result。

语法

像 JavaScript 这样的编程语言的语法是指给定语句或表达式应遵循的形式或规则集。编程语言只不过是一系列字符和符号，每种语言都有自己定义什么序列有效或无效的方式。当 JavaScript 中的一段代码不符合其语法时，就称为语法错误。

JavaScript 语义

与语法相反的语义是编程语言构造的实际含义，如表达式或语句。它描述了脚本或程序可能如何执行。它还可以描述运行代码的浏览器或平台以及成功执行程序所需的输入/输出参数。一段具有无效语法的代码不能在语义上进行评估，因为它是语言无法接受的无效结构。

JavaScript 最佳实践

JavaScript 最佳实践确保代码质量，提高代码可读性，并使代码维护更容易。围绕文件命名约定和编码约定的 JavaScript 最佳实践包括有关命名和声明变量和函数、使用空格、缩进和注释的规则，以及一般的 JavaScript 编程实践和原则。这些最佳实践几乎是所有 JavaScript 课程的标准，并且通常会被记录在案以供 Web 开发、游戏开发或软件开发团队确保严格遵守。

JavaScript 最佳实践包括：

JavaScript 编码约定

JavaScript 代码约定包括始终使用两个空格来缩进代码块（绝不是制表符，不同的编辑器对它们的解释不同）、在运算符周围和逗号之后放置空格、始终以分号结束语句以及避免行长于 80 个字符。

尽管浏览器倾向于对 JavaScript 语法宽容——这也是为什么 JavaScript 被认为是一种对初学者友好的编程语言的部分原因——但这并不意味着你应该养成不编写混乱代码的习惯。

干净的代码意味着需要解决的错误更少、代码安全性更高以及其他程序员参与的时间更轻松。干净的代码也可以通过脚本转换为其他格式，而不需要人工干预。

称为 linters 的 JavaScript 验证工具可以帮助你在保存代码时自动发现代码中的语法问题。

全局变量和局部变量

你应该尽量减少全局变量的使用或完全避免使用它们，包括所有对象、数据类型和函数。由于页面上的每个 JavaScript 文件都在相同的范围内运行，因此在你的代码中使用全局函数或变量可能会导致在你的代码之后包含的其他脚本可能包含相同的变量和函数名称，从而覆盖你的变量和功能。最好使用局部变量。

函数中使用的每个变量都应声明为局部变量（它们应使用 var 或 let 关键字声明，否则它们将成为全局变量）。

JavaScript 声明

JavaScript 声明的最佳做法是将它们放在每个脚本或函数的顶部。这样可以更轻松地避免不需要的全局变量，最大限度地减少意外重新声明的可能性，并最终创建整体更简洁的代码。

将 JavaScript 数字、字符串或布尔值视为原始值

你应该避免将字符串、数字和布尔值声明为对象，因为它会大大降低执行速度并导致许多不需要的副作用。

阻止var声明

从一开始，JavaScript 开发人员就使用 var 来声明变量，这可能会导致在使用时创建的变量的范围出现问题。自 ES6 发布以来，const 和 let 关键字使开发人员能够在块级范围内声明变量，因此变量仅存在于相应的块内。

JavaScript 文件命名约定

JavaScript 文件命名约定可确保你编写的所有 JavaScript 代码的一致性和功能性。

一些命名约定归结为每个开发人员的选择——例如，许多人选择用大写字母编写全局变量和常量——同时也有一些硬性规定，比如名称不以 $ 符号开头（因为它会与许多 JavaScript 库）。

程序员之间存在关于在变量名中使用连字符、下划线或驼峰式命名的争论。JavaScript 本身使用驼峰命名法，jQuery 和其他 JavaScript 库也是如此，因此通常推荐这样做。

其他需要记住的 JavaScript 文件命名约定包括：

名字要具体

你说得越具体，你花在记住名字所指内容上的时间就越少。这也使你不必用注释过多地填充代码，这是 JavaScript 的另一个重要最佳实践。

一个字母的名字

同样，为避免因不必要的混淆而减慢速度，请尽量避免使用单字母名称。（对于非常常见的名称可以例外。）

虽然短名称通常比长名称好，但在某些情况下选择较长的名称可能是值得的，因为额外的描述会极大地帮助清晰度。

变量名

当你命名一个变量时，名字应该足够清楚和详细，这样就不会让人怀疑它的用途。同样，你不需要仅仅为了定义变量而编写注释。

函数名称

函数名称以动词开头，因为它们用于执行操作。尝试对相同的动作使用相同的动词——这不是你想在动词选择上发挥创意的领域。

类名和文件名

类名应该是名词，并且应该遵循 PascalCase。对于 JavaScript 文件名，通常使用 PascalCase 或 kebab-case，这取决于个人选择。PascalCase 应该用于 React 的组件名称。