javascript 操作符-成为专家需要掌握的 36 个 JavaScript 概念

你会看到很多人指责 JavaScript 很奇怪,有时甚至毫无价值。 人们指责它是因为他们不了解事情的本质。

虽然我同意 JavaScript 中某些场景的处理方式有所不同,但这并不让它变得奇怪,而是以它自己的方式变得美丽。

要开始热爱一门编程语言,你应该从一一理解和掌握它的概念开始。

为了成为全面的 JavaScript 专家,您需要掌握以下 36 个 JavaScript 概念。

虽然这是我最长的文章之一,但我向您保证它非常值得您花时间。 感谢斯蒂芬和莱昂纳多提供的资源。

参考资料位于 Leonardo 的 GitHub 存储库中(地址:),其中包含下面解释的该概念的所有学习资料。 请花点时间理解下面提到的每个概念。

1. 调用栈执行

每个人都听说过 Stack Overflow 网站。 但你知道真正的堆栈溢出是什么吗? 堆栈溢出是与调用堆栈的操作相关的错误。

通过了解调用堆栈,您将了解 JavaScript 等高级语言是如何执行的。

2. 原始数据类型

ETC!

当您将字符串 bar 参数传递给常量 foo 时,foo 是原始字符串类型。 这是每个人都可以接受的。 但是为什么可以访问字符串类型的length属性呢?

是不是很奇怪啊。

此功能称为手动装箱。 在前面的示例中,JavaScript 将常量包装到临时包装对象中,然后访问该对象的 length 属性。 一旦完成此步骤,该物体将被安全地丢弃。

通过深入了解基本数据类型,您将了解它们在二进制表示之前如何存储在视频内存中。 您还将了解到这种“奇怪”的情况是如何发生的,以及它们背后的逻辑。

3. 值类型和引用类型

最近,我对 JavaScript 中“按引用传递”的概念如何工作感到有点困惑。 虽然我知道 C 和 Java 等语言中“按引用传递”和“按值传递”的概念,但我不确定它在 JavaScript 中是如何工作的。

您是否知道在 JavaScript 中,为变量分配非原始值实际上是为该值分配引用? 引用指向存储该值的视频内存位置。

从里面的示例可以看出,对 arr2 所做的任何更改也将反映在 arr1 上。 这是因为它们只保存对值的引用,而不是实际值本身。

通过理解值类型和引用类型的概念,你将更好地理解变量是如何赋值和内存引用的。

4. 强制类型转换

这个概念主要解释了隐式强制转换和显式强制转换之间的区别。 这是 JavaScript 中少数可能出错的地方之一。 对于隐式类型转换的概念尤其如此,它对于不同的数据类型表现不同。

这是JavaScript笔试中最常见的问题之一。

通过清楚地理解类型转换,您已经了解了 JavaScript 最棘手的概念之一。

5. 相等比较和'typeof'运算符

这个概念基本上解释了双等号和三等号的使用以及何时以及为何使用它们。 虽然它们表面上看起来是一样的,并且大多数时候会产生相同的结果,但如果您在不知情的情况下使用它们,它们可能会导致您意想不到的错误。

您还应该能够使用 typeof 运算符并了解输出的可能性。 但当有物体时,它可能会加倍令人不安。

6. JavaScript 范围

范围是一个我相信你在 JS 之旅开始时就应该理解的概念。 按照Wissam的说法,作用域的简单定义就是当编译器需要变量和函数时,它就是寻找这个变量和函数的地方。

三目操作符_javascript   操作符_可选链操作符

了解作用域将使您能够更有效地使用 JavaScript。 您应该了解全局作用域、块作用域和函数作用域,也称为词法作用域。

JS 作用域一开始可能会令人困惑,但是一旦您了解了它的工作原理,使用起来就会特别令人兴奋。

7. 陈述和表达式

这是 JavaScript 中的两个主要句子类别。 您应该知道这三者之间的区别以及句子的估计方式。 这将使您充分理解代码是如何构造成表达式和句子的。

您会注意到大部分代码都是表达式,并且使用的句子相对较少。 也可以避免这两种方法使用不当而造成的错误。

8. 立即调用函数表达式和模块

立即调用的函数表达式是定义后立即运行的函数。 它们主要用于防止污染全局范围。

后来,ES6 模块被引入,提供了防止全局范围污染的标准方法,尽管有些人认为它并不是 IIFE 的直接替代品。

通过了解 IIFE 和模块,您在开发应用程序时可以减少因全局作用域处理不当而导致的错误。 然而,使用模块,您可以做很多事情。

9.消息队列和事件循环

正如MDN文档所说,JavaScript有一个基于风暴循环的并发模型,它负责执行代码、收集和处理风暴以及执行排队的子任务。 这个模型与C、Java等其他语言中的模型有很大不同。

在上面的并发模型中,使用消息队列从最旧的消息开始处理消息。 仅当风暴发生并且有风暴侦听器侦听时,消息才会添加到队列中。

通过理解这个概念,您可以更好地理解 JS 在底层是如何工作的以及如何解释您的代码。

10. 时间间隔

要在 JavaScript 中安排调用或函数,您可以使用两种方法。

setTimeout 允许我们在特定时间间隔后运行一次函数。

setInterval 允许我们重复运行一个函数,在特定的时间间隔后开始运行,然后在该时间间隔内不断重复操作。

这些与后面的消息队列和风暴处理程序的概念有些相关。 因此,通过了解时间间隔方法,我们可以了解它们的工作原理并在我们的用例中有效地使用它们。

11.JavaScript引擎

我们现在正在深入研究 JavaScript。 JavaScript 引擎是执行 JavaScript 代码的计算机程序或协程。 JavaScript 引擎可以用多种语言编写。

例如,驱动Chrome浏览器的V8引擎是用C编写的,而驱动Firefox浏览器的SpiderMonkey引擎是用C和C++编写的。

对于您来说,了解正在使用哪种 JavaScript 引擎来编写高效的代码非常重要。 使用webview的联通开发者应该高度重视这一点。

12. 位运算

这些操作将值视为位(0 和 1),而不是十进制、十六进制或八进制数。 位运算符对这些二进制表示进行运算,但它们返回标准 JavaScript 值。

通常,您不会在代码中使用此类操作,但它们确实有一些用例。 您可以使用它们来查找素数和素值、颜色转换、颜色提取和配置标志。

通过彻底理解这种位操作,您可以很好地使用 WebGL 等技术,因为它涉及大量的像素操作。

13. DOM和布局树

大多数人都听说过文档对象模型(DOM),但只有少数人深入了解它。 你知道你在浏览器中看到的并不是 DOM 吗? 它就是渲染树,它实际上是 DOM 和 CSSOM 的组合。

通过了解 DOM 的工作原理、结构以及页面的呈现方式,我们可以借助 JavaScript 动态地操作网页。 这对于确保我们的应用程序以高标准运行尤其必要。

14.班及鞋厂

JavaScript 不是面向对象的语言。 然而,为了模拟 OOP 属性,需要使用构造函数。 Tania 表示,“JavaScript 中的类并没有真正提供额外的功能,并且通常被描述为在原型和继承之上提供语法糖,因为它们提供了更清晰、更高贵的语法。

其他编程语言都使用类,因此 JavaScript 中的类语法使开发人员可以更轻松地在语言之间切换。 ”

工厂函数是一个不是类或构造函数并返回对象的函数。 JS 大师 Eric Elliot 说:“在 JavaScript 中,任何函数都可以返回一个新对象。当它不是构造函数或类时,它被称为鞋工厂函数。”

您应该很好地理解这两个概念,特别是当您开始开发更大的应用程序时。

15.“this”关键字和“apply”、“call”和“bind”方法

我个人觉得对于一个JS开发者来说,理解this关键字是至关重要的。 如果你没有正确理解它,你的应用程序稍后会遇到各种各样的问题。

如果你对关键词有很好的理解,那么你就可以专注于关键词、关键词和技巧。

这些技巧对于使用适当的上下文调用函数是必要的。 当传回访问此的反弹时,您将非常需要方法。 这是我在帮助同学调试代码时学到的!

16. 构造函数和 'instanceOf' 运算符

构造函数就像常规函数一样。 但它们有很多不同之处。 按照约定,函数名称以大写字母开头,并且只能使用 new 运算符执行。

有 OOP 背景的程序员应该熟悉这个新关键字。

为了正确识别对象的类型,我们使用instanceOf运算符。 简单来说,它检测一个对象是否是另一个对象的实例。

这将帮助您了解对象如何相互继承。 继承是通过原型来实现的。

17. 原型

这是 JavaScript 中最令人困惑的概念之一,即使对于拥有六年经验的人来说也是如此。

JavaScript 中的原型是一种在对象之间共享通用功能的机制。 JavaScript 中几乎所有对象都是 Object 的实例。 一个典型的对象继承了 的所有属性和技能。

简单地说,原型是 JavaScript 对象继承方法和属性的对象。

通过更好地理解原型,您可以构建高效、快速的应用程序。

18. 使用“new”、“Object.create”、“Object.assign”创建对象

在 JavaScript 中创建对象的方法有很多种。 但有些人有动机选择而不是使用关键字。

创建时,可以使用现有的对象作为新创建的对象的原型。 这将允许重用现有对象的属性和函数,有点像 OOP 中的继承概念。

使用方法时,可以将可枚举自身的属性从一个或多个源对象复制到目标对象。在这些情况下,目标对象的原型不包含源对

图像的属性。

这是两种方法之间的主要区别。

通过了解这三种创建对象的方法,您可以根据您的用例在应用程序中适当地使用它们来创建内存高效的程序。

19.“map”、“filter”和“reduce”方法

这三种方法在链表操作时非常有用。 它们可以在链表的原型中找到。

如果您有一个链接列表并且您想对每个元素执行某些操作,那么您可以使用方法。

如果您有一个链表并希望对每个元素运行一个条件并获取通过该条件的值javascript 操作符,则可以使用模式。

方法对链表的所有元素执行reducer函数,最后返回一个值。 一个完美的反例是获取链表中所有元素的总和。

注意,以上三种方法都不会改变原来字段的值。

20. 纯函数、副作用和状态变化

这三个概念对于 JavaScript 开发人员尤其重要。 状态更改对于使用 React 的开发人员尤其重要。

纯函数始终返回与提供的输入一致的值,而不会访问或改变其范围之外的任何变量。 这种类型的函数更容易阅读、调试和测试。

副作用是在一段代码中创建变量并在不需要时在整个范围内可用。 如果你的函数访问作用域之外的变量,总会有副作用。

状态改变是指改变变量的值。 如果更改变量,它可能会影响其他函数,具体取决于其先前的值。 在反应环境中,建议您不要改变状态。 这是一篇关于不变性的非常好的文章。

21. 关闭

闭包很难理解。 但一旦你理解了它,你就会开始感受到 JavaScript 的美妙之处。 网上有丰富的资源。 只要确保你花时间学习闭包即可。

闭包允许您从内部作用域内访问外部函数的作用域。 每次创建函数时,都会创建一个 JavaScript 闭包。

了解为什么应该使用闭包来更深入地了解它们。

22. 高阶函数

高阶函数是将其他函数作为参数或返回函数的函数。 高阶函数让合成发挥最大的威力。 您可以创建仅处理一项任务的较小函数,然后借助此类较小函数构造复杂函数。 它还降低了代码的可重用性。

这也减少了错误并使我们的代码更易于阅读和理解。

23. 递归

递归是所有编程语言中的常见概念。 简单来说,递归就是将大问题分解为小问题的概念。

实际上,这通常意味着编写一个调用自身的函数。 尽管递归可能是一个令人困惑的概念,让您头疼,但通过大量练习,从小问题开始,您可以更好地理解它。

但要小心,如果不小心使用递归,可能会遇到堆栈溢出错误。 作为练习,对这个错误进行一些研究。 您需要改变对第一个主题(调用堆栈)的了解,以完全理解此错误的上下文。

24. 集合和生成器函数

集合和生成器函数是 ES6 中的新增功能。 新推出的系列有 、 、 和 。 这些集合为您提供了一些非常好的用例。 您必须了解它们的用法,尤其是在使用现代 JavaScript 时。

另一方面,生成器函数有时可能有点难以理解,特别是对于初学者来说。

生成器允许您编写代码函数,这些函数允许您暂停和重新启动函数,而不会阻止其他代码的执行,这在 JavaScript 中非常罕见。

25. 承诺

杰奎琳这样解释:“想象一下你是个婴儿。你爸爸向你保证下周会给你买一部新手机。”

直到明天你才会知道是否能拿到那部手机。 要么你爸爸真的给你买了一部全新的手机,要么他因为不高兴而没有给你买。

这是一。 共有三种状态。 他们是:

待处理:您不知道是否会接到那个电话。

满足:妈妈很高兴,她给你买了一部全新的手机。

拒绝:妈妈不高兴,不给你买手机。

这是迄今为止我所得到的最简单、最清晰的解释。 老实说,我是在做演示项目时学到这个概念的。

这让我很难理解正在发生哪些事情,因为我不知道哪些事情正在发生。 快进到今天。 感谢网络上丰富的资源,我对. 结合我对项目的工作知识,我也能有一个清晰的认识。

26.异步编程

要了解什么是异步编程,我们首先应该刷新一下同步编程的知识。 同步编程是线程阻塞的,由于JavaScript是单线程的,代码将逐行执行。

但使用异步代码,您可以执行长时间的网络请求,而不会阻塞主线程。 当您必须执行多个需要很长时间才能完成的任务时,这非常有用。

但在某些情况下,您可能需要阻塞线程,即使是对于很长的任务。 此时您将使用的概念。

充分学习这个概念将使您能够编写高效执行的程序javascript 操作符,即使在运行许多任务的情况下也是如此。

27.ES6箭头函数

箭头函数是 ES6 的新增功能,在语法上取代了常规函数。 不同之处在于箭头函数不绑定到 、 或 关键字。

这使得箭头在某些情况下是一个不错的选择,而在其他情况下则是一个糟糕的选择。

因此,永远不要养成使用箭头函数的习惯。 根据您的用例实施它们。

28. 数据结构

无论使用哪种编程语言,数据结构都是开发人员应该具备的基础知识之一。

“糟糕的程序员害怕代码。优秀的程序员害怕数据结构以及它们之间的关系。”

Linus Torvalds,Linux 和 Git 的创建者

通过深入了解不同的数据结构,您可以构建在不同环境中运行良好的高效程序。 您应该了解数组、队列、堆栈、树、图和哈希表。

29.时间复杂度

时间复杂度分析也是计算机编程的另一个基本原理,与编程语言无关。 为了构建更好的应用程序,您应该编写更好的解决方案。 为此,您应该了解时间复杂度的概念。 它有时被称为大O。

Big O 表示法描述了算法所需的执行时间或所使用的空间。 大O符号专门描述了最坏的情况。

这将使您即使在最坏的情况下也可以选择和实施性能最佳的算法。

30. 算法

这是您在计算机科学课程中首先要学习的内容之一。 简而言之,算法就是一个逐步实现某个目标的过程。 程序员应该能够从算法的角度看待任何问题。

他们应该能够逐步完善问题和解决方案。 这个算法就是你稍后要写的程序。

尽管算法有数千个用例,但其中两个用例相当常见:

搜索

排序

这两个用例对于程序员来说非常常见,您至少应该彻底了解可用的已知算法。 没有硬性规则要求您应该使用其中一种算法,但该算法在性能方面众所周知并且有详细记录。

您甚至可以创建自己的算法并将其介绍给全世界。 如果它比当前已知的算法更好,您可能会成为下一个编程明星!

31. 继承、多态性和代码重用

JavaScript 中的继承与原型一起使用。 这是因为 JavaScript 是一种非面向对象的语言。 然而,JavaScript 通过提供原型继承来提供 OOP 的一些功能。

另一方面,多态性是一个对象、变量或函数可以有多种方式的概念。 在 JavaScript 中,要看到多态性的功效有点困难,因为更典型的多态类型在静态类型系统中更为明显。

以上两个概念都可以帮助我们实现JavaScript中的代码重用。 充分理解上述两个概念,尤其是 JavaScript,将使您能够编写高质量且功能齐全的代码。

32.设计模式

在软件工程中,设计模式是针对常见问题的众所周知的、可重复的解决方案。 有多种设计模式,每种都有自己的用例。 23(GoF) 模式通常被认为是所有其他模式的基础。 理解它们相当困难,但您至少可以尝试理解它们的用例。

下面是 Felipe 的精彩存储库,其中包含用 JavaScript 实现的 23 种 GoF 模式。 请浏览本文末尾提到的参考资料,以熟悉 Leonardo 提供的一些重要资源,他是本文的灵感来源。

33.函数式编程

根据 Wiki 的说法,“函数式编程是一种编程范式,是一种构建计算机程序的结构和元素的风格,它将评估视为对物理功能的评估,并防止状态变化和数据变化。”

您需要掌握函数式编程的几个概念:

纯函数

不变性

参考透明度

高阶函数

理解函数式编程的这个概念肯定会让你占据上风。

34.干净代码原则

这是每个开发人员都应该具备的基本技能,无论他们使用哪种编程语言。 每种编程语言都有一套单独的良好实践。

虽然这种“良好”做法是主观的,并且在不同的工作场所中有所不同,但有一些做法通常被认为是“良好”的。

通过遵循这个编码原则,您可以确保您的代码对每个人来说都是可读和可维护的。 这将帮助您和您的团队在应用程序开发过程中顺利合作。

35.解构主义

ES6 中引入了解构运算符。 它有很多您应该熟悉的用例。 对于相同的用例,它们比以前的实现更简单、更高效。 这也称为加宽运算符。