ES6 흔 한 면접 문제 총화
10704 단어 노을 을 위 하여 만들다자 바스 크 립 트 시리즈
머리말
오늘 블 로 거들 은 ES6 흔 한 면접 문제 총 결 을 공유 합 니 다!싫 으 면 뿌리 지 마 세 요. 이의 가 있 으 면 토론 을 환영 합 니 다!
시작 하 다
1.
es5
와 es6
의 차 이 를 알 고 있 는 것 es6
을 말 해 보 세 요.ECMAScript5
, 즉 ES5
은 ECMAScript
의 다섯 번 째 수정 으로 2009 년 표준화 가 완료 되 었 다.ECMAScript6
, 즉 ES6
은 ECMAScript
의 여섯 번 째 수정 으로 2015 년 에 완성 되 었 으 며 ES2015
이 라 고도 부른다.ES6
는 ES5
에 이 어 개 선 된 것 으로 ES5
보다 더욱 간결 하고 개발 효율 을 높 였 다.ES6 에 추 가 된 일부 기능
var
, let
, const
간 의 차이var 성명 변 수 는 중복 성명 할 수 있 으 며, let 는 중복 성명 할 수 없습니다.
var 는 블록 급 에 제한 을 받 지 않 고 let 는 블록 급 에 제한 을 받는다.
var 는 window 와 일치 합 니 다 (속성 이 걸 립 니 다). let 는 window 와 일치 하지 않 습 니 다.
var 는 성명 의 위 에서 변 수 를 방문 할 수 있 으 며, let 는 일시 적 으로 데 드 존 이 있 으 며, 성명 의 위 에서 변 수 를 방문 하면 오 류 를 보고 할 수 있 습 니 다.
const 성명 후 값 을 부여 해 야 합 니 다. 그렇지 않 으 면 잘못 보고 할 수 있 습 니 다.
const 는 가 변 적 이지 않 은 양 을 정의 합 니 다. 바 뀌 면 잘못 보고 합 니 다.
const 는 let 와 마찬가지 로 window 와 일치 하지 않 고 블록 급 역할 도 메 인 을 지원 하 며 성명 의 위 에 접근 하 는 변 수 는 잘못 보 고 됩 니 다.
3. 화살표 함 수 를 사용 할 때 무엇 을 주의해 야 합 니까?
4.
ES6
템 플 릿 문자열 은 어떤 새로운 기능 이 있 습 니까?템 플 릿 문자열 과 같은 기능 을 수행 합 니 다.기본 문자열 포맷.표현 식 을 문자열 에 삽입 하여 연결 합 니 다.${} 로 정의 하기
ES5 에서 우 리 는 여러 줄 의 문자열 이나 문자열 을 한 줄 로 연결 합 니 다.ES6 반 따옴표 (`) 는 해결 할 수 있다.
클래스 템 플 릿 문자열 의 기능
et name = 'sunny';
let age = 21;
let str = ' ,${name} ${age} '
str = str.replace(/\$\{([^}]*)\}/g,function(){
return eval(arguments[1]);
})
console.log(str);// ,sunny 21
5. 소개
Set
, Map
의 차이 점 은?응용 장면 세트 는 데이터 재 구성 에 사용 되 고 지도 는 데이터 저장 에 사용 된다.
Set:
Map:
ECMAScript 6
어떻게 쓰 지 class
, 왜 나 타 났 을 까 class
?ES6 의 class 는 문법 사탕 으로 볼 수 있 습 니 다. 대부분의 기능 인 ES5 는 할 수 있 습 니 다. 새로운 class 기법 은 대상 의 원형 을 더욱 선명 하 게 하고 대상 을 대상 으로 프로 그래 밍 하 는 문법 과 같 습 니 다.
//
class Point {
constructor(x,y) {
//
this.x = x; //this
this.y = y;
} toString() {
return '(' + this.x + ',' + this.y + ')';
}
}
7.
Promise
구조 함 수 는 동기 집행 입 니까? 비동기 집행 입 니까? 그러면 then
방법 은 요?promise
구조 함 수 는 동기 적 으로 실 행 된 것 이 고 then
방법 은 비동기 적 으로 실 행 된 것 이다.8.
setTimeout
, Promise
, Async/Await
의 차이이벤트 순환 중
과
로 나 뉜 다.그 중에서
setTimeout
의 리 셋 함 수 는 매크로 작업 대기 열 에 넣 고 스 택 이 비 워 진 후에 실 행 됩 니 다.promise.then
의 반전 함 수 는
의
에 넣 고 매크로 작업 의 동기 코드 가 실 행 된 후에 실 행 됩 니 다.async
함수 표시 함수 에 비동기 방법 이 있 을 수 있 습 니 다. await 뒤에 표현 식 이 있 습 니 다.async
방법 이 실 행 될 때 await
표현 식 을 즉시 실행 한 다음 표현 식 뒤의 코드 를 마이크로 작업 대기 열 에 넣 고 실행 스 택 을 내 보 내 동기 코드 를 먼저 실행 하도록 합 니 다.9.
promise
몇 가지 상태 가 있 는데 언제 들 어 갈 까요?세 가지 상태: pending, fulfilled, reject
두 과정: padding - > fulfilled, padding - > rejected
pending 이 rejectd 일 때 catch 에 들 어 갑 니 다.
10. 아래 의 출력 결 과 는 얼마 입 니까?
const promise = new Promise((resolve, reject) => {
console.log(2);
resolve();
console.log(333);
})
promise.then(() => {
console.log(666);
})
console.log(888);
catch
새로 만 든 후에 바로 실행 되 기 때문에 2, 333 을 먼저 출력 하고 Promise
내부 코드 는 이번 이벤트 순환 의 끝 에 바로 실행 되 기 때문에 888 을 계속 출력 하고 마지막 에 666 을 출력 합 니 다.11. 구조 할당 을 사용 하여 두 변수의 값 교환 을 실현 합 니 다.
let a = 1;let b = 2;
[a,b] = [b,a];
12. 하나의 대상 을 설계 하고 키 이름 의 유형 은 적어도 하나의
Promise.then()
유형 을 포함 하 며 모든 것 을 옮 겨 다 니 는 것 을 실현 합 니 다 symbol
let name = Symbol('name');
let product = {
[name] : " ",
"price" : 1999
};
Reflect.ownKeys(product);
13. 아래
key
구조, 인쇄 된 Set
은 얼마 입 니까?let s = newSet();
s.add([1]);s.add([1]);
console.log(s.size);
정 답: 2
두 배열 [1] 은 같은 값 이 아 닙 니 다. 각각 정 의 된 배열 은 메모리 에 각각 다른 저장 주소 에 대응 하기 때문에 같은 값 이 set 구조 에 저장 되 는 것 이 아니 기 때문에 size 는 2 입 니 다.
14.
size
중 Promise
과 reject
처리 에 있어 어떤 차이 가 있 습 니까?reject 는 이상 을 던 지 는 데 사 용 됩 니 다. catch 는 이상 을 처리 하 는 데 사 용 됩 니 다.
reject 는 Promise 의 방법 이 고 catch 는 Promise 인 스 턴 스 의 방법 입 니 다.
reject 후의 것 은 then 의 두 번 째 반전 에 들 어 갈 것 입 니 다. then 에 두 번 째 반전 이 쓰 여 있 지 않 으 면 catch 에 들 어 갑 니 다.
네트워크 이상 (예 를 들 어 네트워크 차단) 은 catch 에 직접 들 어가 then 의 두 번 째 반전 에 들 어가 지 않 습 니 다.
15. 사용
catch
손 으로 하나 쓰기 class
// Promise
class Promise{
constructor(executer){// constructor
this.status = 'pending';// pending
this.value = undefined// undefined
this.reason = undefined// undefined
// pending
let resolveFn = value =>{
// resolve
if(this.status == pending){
this.status = 'resolve';
this.value = value;
}
}
// reject
let rejectFn = reason =>{
if(this.status == pending){
this.status = 'reject';
this.reason = reason;
}
}
try{
// resolve reject executer
executer(resolve,reject);
}catch(e){
reject(e);// catch
}
}
then(onFufilled,onReject){
// onFufilled
if(this.status = 'resolve'){
onFufilled(this.value);
}
// onReject
if(this.status = 'reject'){
onReject(this.reason);
}
}
}
16. 어떻게 사용 하 는가
promise
let arr = [12,43,23,43,68,12];
let item = [...new Set(arr)];
console.log(item);//[12, 43, 23, 68]
17. 아래
Set
순환 을 for
형식 으로 바꾼다.let arr = [11,22,33,44,55];
let sum = 0;
for(let i=0;i
답:
let arr = [11,22,33,44,55];
let sum = 0;
for(value of arr){
sum += value;
}
18. 이해
for of
및 대 async/await
의 장점async await 는 비동기 적 인 것 을 해결 하 는 데 사용 되 며, async 함 수 는 Generator 함수 의 문법 당 입 니 다.
키워드 async 를 사용 하여 함수 내부 에서 await 를 사용 하여 이 보 를 표시 합 니 다.
async 함수 가 Promise 대상 을 되 돌려 줍 니 다. then 방법 으로 리 셋 함 수 를 추가 할 수 있 습 니 다.
함수 가 실 행 될 때 await 를 만나면 먼저 돌아 가 비동기 작업 이 끝 날 때 까지 기 다 렸 다가 함수 체 내 뒤의 문 구 를 실행 합 니 다.
async 비교 Generator 의 장점:
Generator
, forEach
, for in
세 가지 차이 점for of
가 져 오기 내 보 내기 모듈 을 말 해 보 세 요.import 키 로 가 져 오기
//
import {sum} from "./example.js"
//
import {sum,multiply,time} from "./exportExample.js"
//
import * as example from "./exportExample.js"
export 키 워드 를 통 해 내 보 내기
// export ,
export var firstName = 'Chen';
export var lastName = 'Sunny';
export var year = 1998;
//
var firstName = 'Chen';
var lastName = 'Sunny';
var year = 1998;
export {firstName, lastName, year};
// export default , import
let bosh = function crs(){}
export default bosh;
import crc from 'crc';
// export default , import
let bosh = function crs(){}
export bosh;
import {crc} from 'crc';
여기까지 ES6 흔 한 면접 문제 요약!여러분, 어서 가서 해 보 세 요!
마지막.