10個開發者常問的JavaScript面試題（附答案解析）

本篇文章為初學者介紹10 個最常被問到的 JavaScript 面試題目。有一定的參考價值，有需要的朋友可以參考一下，希望對初學者有幫助。

在本文中，我收集了關於Javascript 最常被問到的 10 個問題及其答案。

這10 個問題大多涉及 Javascript 的基礎知識，所以如果你剛開始學習 JS，最好理解並掌握它們並且。

這個 10 問題涉及 JS 中閉包、promise，變數提升、類別等等。儘管這些知識不是很難，但是知道答案是一件好事，因為其中一些經常在面試中會被問到。 【推薦學習：javascript高階教學】

Javascript 中的閉包是什麼？

閉包是封閉在一起的函數的組合，其中內部函數可以存取其變數和外部函數的變數。

最簡單的解釋方法就是上例：

function outer() {
  var name = 'Maria';
  function inner() {
    console.log(name);
  }
  inner();
}
outer();
// 'Maria'

在上面的程式碼中，你可以看到inner()函數可以存取其父函數變數name。因此，如果呼叫outer()函數，那麼inner()函數的console.log()將傳回name的值Maria。

內部函數可以存取外部函數參數對象，但是內部函數參數與外部一樣，則內部的參數對象會覆寫外部的參數對象。如下所示：

function outer(a, b) {
  const inner = (a, b) => console.log(a, b);
  inner(1, 2);
}
outer('Alice', 'Mark');
// returns 1, 2

我們使用閉包的主要原因是傳回可以傳回其他函數的函數。

Javascript中的 DOM 是什麼

DOM 是文件物件模型，它是網站的物件導向的表示形，可以使用 Javascript 來修改。

使用 JS 可以操縱 DOM 元素，例如顏色，位置，大小。為了選擇頁面的特定元素，Javascript 提供了一些方法：

• getElementById() - 透過id屬性選擇一個元素
• #getElementsByName() - 透過name屬性選擇一個元素
• getElementsByTagName() - 選擇所選標籤的所有元素，
• getElementsbyClassName() - 選擇特定類別名稱的所有元素

*　querySelector()　-　透過CSS選擇器選擇元素。

Javascript　也提供了其他操作元素的方法，而不僅僅是取得元素，例如appendChild()或innerHTML()。

Javascript 的 Promise  是什麼

Promise 是非同步程式設計的解決方案，可以取代傳統的解決方案--回呼函數和事件。 ES6統一了用法，並原生提供了Promise物件。作為對象，Promise 有一下兩個特點： （1）對象的狀態不受外界影響。 （2）一旦狀態改變了就不會在變，也就是說任何時候 Promise 都只有一種狀態。

Promise 有三種狀態，分別是：Pending （進行中）， Resolved (已完成)， Rejected (已失敗)。 Promise 從Pending 狀態開始，如果成功就轉到成功態，並執行resolve回呼函數；如果失敗就轉到失敗狀態並執行reject回呼函數。

如果 Promise 被解析(resolved)，我們可以呼叫then()方法並使用傳回值執行操作。如果被拒絕(rejected)，我們可以使用catch()方法來處理錯誤。

處理非同步程式設計的其他方法還有async/await和callbacks。

Javascript 中的原型是什麼?

原型通常指的是prototype和__proto__這兩個原型對象，其中前者叫做顯式原型物件,後者叫做隱式原型物件。

Javascript物件從原型繼承方法和屬性，而Object.prototype在繼承鏈的頂部。 Javascript prototype關鍵字也可以用來為建構函式新增值和方法。

來看看事例：

function Animal(name, kind, age) {
  this.name = name;
  this.kind = kind;
  this.age = age;
}

Animal.prototype.ownerName('Mark');

可以看到，透過使用原型，我們能夠將ownerName屬性加入到Animal()建構函數中。

Javascript 的變數提升是什麼

提升是一種機制，它將所有宣告的變數和函數提升到它們局部作用域的頂部，如果變數和函數被放置在全域作用域，則會被提升到全域作用域的頂部。

Javascript中，可以在變數被使用後在宣告它。

提升用於避免在變數或函數有在沒有定義之前就執行導致的 undefined 錯誤。

name = 'Ted';
console.log(name);
var name;
// 'Ted'


var name;
name = 'Ted';
console.log(name);
// 'Ted';

使用 var 声明的变量，如果没有赋值，则默认会被初始化为 undefined, let 和 const 则不会。另外，需要注意的是，在声明const时，必须同时初始化它，因为后面不可在更改它。

Javascript中的对象是什么

对象只是一种特殊的数据。对象拥有属性和方法。JavaScript 中的所有事物都是对象，如:字符串、数值、数组、函数等。

对象的属性：反映该对象某些特定的性质的，如：字符串的长度、图像的长宽等；

对象的方法：能够在对象上执行的动作。例如，表单的“提交”(Submit)，时间的“获取”(getYear)等；

属性只是简单的值，而方法是可以在对象上执行的操作。

var student = {
  firstName: 'Alice',
  lastName: 'Jones',
  age: 21,
  sayHi: () => {
    return 'Hi, I am ' + this.firstName;
  }
}

在上面的代码中，你可以看到Student对象，其中包含三个属性和一个方法。

Javascript 中的函数是什么

在javascript中函数是一段可以被执行或调用任意次数的JavasScript代码,在数据类型中属于"function"。函数也拥有属性和方法，因此函数也是对象。

在Javascript中函数定义函数声明或函数表达式由关键字function开始。在定义函数时，可以在函数名后面的括号中添加一些参数。当我们调用函数时，括号中传递的值称为参数。

function calculate(x, y) {
  return x * y;
}

calculate(2, 5);

Javascript中的纯函数是什么

如果函数的调用参数相同，则永远返回相同的结果。它不依赖于程序执行期间函数外部任何状态或数据的变化，必须只依赖于其输入参数。

顾名思义，纯函数跟我们初中数学的基本函数一样，遵循一定的映射关系，输入决定输出，一个输入只能对应一个输出。不同的输入可以有相同的输出，但是相同的输入不能有不同的输出

一个函数，如果符合以下两个特点，那么它就可以称之为 纯函数：

• 对于相同的输入，永远得到相同的输出
• 没有任何可观察到的副作用

Javascript中的构造函数是什么

构造函数是一种特殊的方法，用于初始化和创建 Javascript 类中的对象。

JavaScript 中的构造函数和其它语言中的构造函数是不同的。 通过 new 关键字方式调用的函数都被认为是构造函数。

在构造函数内部，this 指向新创建的对象 Object。 这个新创建的对象的 prototype 被指向到构造函数的 prototype。

如果被调用的函数没有显式的 return 表达式，则隐式的会返回 this 对象，也就是新创建的对象。

const Person = (name, age) => {
  this.name = name;
  this.age = age;
}

var man = new Person('Mark', 23);
console.log(man);
// { name: 'Mark', age: 23 }

在上面的代码中，我创建了一个Person构造函数，在下面的代码中，创建了一个名为man的新变量，并基于Person构造函数创建了一个新对象。

Javascript类是什么？

自从 ES6 引入以来，我们可以在Javascript中使用类。 类是一种函数，我们使用关键字class代替function 关键字来初始化它。

除此之外，我们还必须在类内部添加constructor()方法，该方法在每次初始化类时都会调用。

在constructor()方法内部，我们添加了类的属性。 要基于现有的类创建另一个类，我们可以使用extends关键字。

在JavaScript中使用类的一个很好的例子是 React 框架，它是类的组件。

总结

在本文中，我收集了开发者经常问的 10 个Javascript问题，并给出答案，答案不是唯一，这里只是自己的一些见解，希望本文能给初学者带来一些帮助。

原文地址：https://dev.to/duomly/10-most-common-javascript-questions-answered-1083

作者：Duomly

更多编程相关知识，请访问：编程视频！！

以上是10個開發者常問的JavaScript面試題（附答案解析）的詳細內容。更多資訊請關注PHP中文網其他相關文章！