# ES6 Js 面試詳解
###### tags: `interview`

==========================================================================
Q1. ES6 中 for…of 與 for…in 的區別？
==========================================================================

A.
1、在循環對象屬性的時候，使用for…in，在遍歷數組的時候的時候使用for…of。
2、for…in循環出的是key，for…of循環出的是value
3、for…of是ES6新引入的特性。修復了ES5引入的for…in的不足
4、for…of不能循環普通的對象，需要通過和Object.keys()搭配使用

var student = {
name: 'Jack',
age: 27,
sex: 'female'
};

var arr = [1, 4, 'small'];
arr.school = 'zheda';

// 1、for...in 遍歷對象，得到key
for (let key in student) {
console.log(key); // name,age,sex
}

//for (let i of student) { // 報錯：student is not iterable(可迭代的)
// console.log(i);
//}

// 2、直接使用for...of報錯，可以用Object.keys(obj);
for (let key of Object.keys(student)) {
// 用Object.keys()獲取對象key的數組
console.log(key); // name,age,sex
}

// 3、for...in遍歷數組，得到index + key
for (let i in arr) {
console.log(i); // 0,1,2,school
}

// 4、for...of遍歷數組，得到value
for (let key of arr) {
console.log(key); // 1,4,small
}

==========================================================================
Q2 e.target and e.currentTarget 的區別？
==========================================================================

A.
e.currentTarget : 指的是註冊事件物件
e.target : 指的是實際觸發事件的物件

==========================================================================
Q3 e.stopPropagation() and e.preventDefault() 的區別？
==========================================================================

A.
e.stopPropagation() : 阻止事件傳播（冒泡）
e.preventDefault() : 是停止事件的默認動作

==========================================================================
Q4 請判斷以下等式左右是否相同
==========================================================================
1. 100 === "100"
2. 'abc' === "abc"
3. NaN === NaN
4. NaN == NaN
5. 100 == "100"
6. "1" == "01"

A.
1. return false
2. return true
3. return false
4. return false，NaN和所有值包括自己都不相等
5. return true
6. return false

==========================================================================
Q5 請寫出下列程式印出的值
==========================================================================

1.
let APP_NAME = "ES6_let";
const getAppName = function () {
APP_NAME = "ES6_APP_NAME";
return APP_NAME;
};
console.log(getAppName());

2.
const APP_NAME = "ES6_const";
const getAppName = function () {
APP_NAME = "ES6_APP_NAME";
return APP_NAME;
};
console.log(getAppName());

3.
const numbers = ['one', 'two'];
numbers.push('three');
console.log(numbers);

4.
let constants = Object.freeze({
APP_NAME: "ES6_let"
})
constants.APP_NAME = "ES6_APP_NAME";
console.log(constants.APP_NAME);

5.
let constants = Object.freeze({
APP_NAME: "ES6_let"
})
constants = {
APP_NAME: "ES6_APP_NAME"
}
console.log(constants.APP_NAME);

A.
1. ES6_APP_NAME
2. throw TypeError
3. ['one', 'two', 'three']
4. ES6_let
5. ES6_APP_NAME

==========================================================================
Q6 請寫出var, let, const 差異
==========================================================================
A.
var 全域變數
let 區塊域變數，一般使用在變數(variable)可能會被重新指定值。例如：在迴圈(for loop)中
const 常數，一般使用在識別值(identifier)不會被重新指定值。例如：宣告

==========================================================================
Q7 請寫出JavaScript 陣列處理方法 filter(), find(), forEach(), map(), every(), some(), reduce() 用途
==========================================================================
A.
1. filter() : filter() 會回傳一個陣列，其條件是 return 後方為 true 的物件，很適合用在搜尋符合條件的資料。
2. find() : find() 只會回傳一次值，且是第一次為 true 的值。當有2個相同時，只會回傳第一個。
3. forEach() : 不會額外回傳值，只單純執行每個陣列內的物件或值。
4. map() : 使用 map() 時他需要回傳一個值，他會透過函式內所回傳的值組合成一個陣列。
如果不回傳則是 undefined，回傳數量等於原始陣列的長度，很適合將原始的變數運算後重新組合一個新的陣列。
5. every() : 可以檢查所有的陣列是否符合條件，這僅會回傳一個值 true or false，可以用來檢查陣列中的內容是否符合特定條件。
6. some() : some() 與 every() 非常接近，都是回傳 true or false，差異僅在 every() 需完全符合，some() 僅需要部分符合。
7. reduce() : reduce() 和其他幾個差異就很大了，他可以與前一個回傳的值再次作運算。