江苏龙网

  1. 主页 > 生活百科 > >

针对高级前端的八个级JavaScript面试问题

前端

JAVAScript 是一种功能强大的语言，也是构建现代 Web 的基础之一 。这种强大的语言也有一些自己的怪癖 。例如，你知道 0 === -0 会计算为 true ， 或者 Number("") 会返回 0 吗？
有时候，这些怪癖会让你百思不得其解，甚至让你怀疑 Brendan Eich 在发明 JavaScript 的那一天是不是状态不佳 。但这里的重点并不是说 JavaScript 是一种糟糕的编程语言 ， 或者如其批评者所说的那样，是一种“邪恶”的语言 。所有的编程语言都有某种程度的怪癖，JavaScript 也不例外 。
在这篇博客文章中，我们将深入解释一些重要的 JavaScript 面试问题 。我的目标是彻底解释这些面试问题，以便我们能够理解背后的基本概念，并希望在面试中解决其他类似的问题 。
1- 仔细观察 + 和 - 运算符console.log(1 + '1' - 1);  你能猜到在上面这种情况下，JavaScript 的 + 和 - 运算符会有什么行为吗？
当 JavaScript 遇到 1 + '1' 时，它会使用 + 运算符来处理这个表达式 。+ 运算符有一个有趣的特性，那就是当其中一个操作数是字符串时，它更倾向于执行字符串的连接 。在我们的例子中，'1' 是一个字符串，因此 JavaScript 隐式地将数字 1 转换为字符串 。因此，1 + '1' 变成了 '1' + '1'，结果是字符串 '11' 。
现在，我们的等式是 '11' - 1 。- 运算符的行为正好相反 。它更倾向于执行数字减法，而不考虑操作数的类型 。当操作数不是数字类型时，JavaScript 会执行隐式转换，将它们转换为数字 。在这种情况下，'11' 被转换为数字值 11，表达式简化为 11 - 1 。
综合考虑：
'11' - 1 = 11 - 1 = 102- 数组元素的复制考虑以下的 JavaScript 代码，并尝试找出其中的问题：
function duplicate(array) {  for (var i = 0; i < array.length; i++) {    array.push(array[i]);  }  return array;}const arr = [1, 2, 3];const newArr = duplicate(arr);console.log(newArr);在这段代码片段中，我们需要创建一个新数组，该数组包含输入数组的重复元素 。初步检查后，代码似乎通过复制原始数组 arr 中的每个元素来创建一个新数组 newArr 。然而，在 duplicate 函数内部出现了一个严重的问题 。
duplicate 函数使用循环来遍历给定数组中的每个项目 。但在循环内部，它使用 push() 方法在数组末尾添加新元素 。这导致数组每次都会变长，从而产生一个问题：循环永远不会停止 。因为数组长度不断增加 ， 循环条件（i < array.length）始终为真 。这使得循环无限进行下去，导致程序陷入僵局 。
为了解决由于数组长度增长而导致的无限循环问题，可以在进入循环之前将数组的初始长度存储在一个变量中 。然后，可以使用这个初始长度作为循环迭代的限制 。这样，循环只会针对数组中的原始元素进行，并不会受到由于添加重复项而导致数组增长的影响 。以下是修改后的代码：
function duplicate(array) {  var initialLength = array.length; // 存储初始长度  for (var i = 0; i < initialLength; i++) {    array.push(array[i]); // 推入每个元素的副本  }  return array;}const arr = [1, 2, 3];const newArr = duplicate(arr);console.log(newArr);输出将显示数组末尾的重复元素，并且循环不会导致无限循环：
[1, 2, 3, 1, 2, 3]3- prototype 和 proto 的区别prototype 属性是与 JavaScript 中的构造函数相关联的属性 。构造函数用于在 JavaScript 中创建对象 。当您定义一个构造函数时，还可以将属性和方法附加到其 prototype 属性上 。这些属性和方法然后变得可以被该构造函数创建的所有对象实例访问 。因此，prototype 属性充当共享方法和属性的通用存储库 。
考虑以下代码片段：
// 构造函数function Person(name) {  this.name = name;}// 添加一个方法到 prototypePerson.prototype.sayHello = function() {  console.log(`Hello, my name is ${this.name}.`);};// 创建实例const person1 = new Person("HAIder Wain");const person2 = new Person("Omer Asif");// 调用共享的方法person1.sayHello();  // 输出：Hello, my name is Haider Wain.person2.sayHello();  // 输出：Hello, my name is Omer Asif.


推荐阅读


上一篇：Python大型Excel文件处理：快速导入、导出与批量处理

下一篇：每个高级前端工程师都应该知道的前端布局