조심해, 바벨이 Symbol의 번거로움을 처리해
어떤 팀은 이 추가적인 polyfill을 도입하는 것을 피하기 위해 Symbol을 사용하지 않으려고 한다.babel을 통해 Symbol을 생성하는 특성(예를 들어
for of 등)을 포함한다.이럴 때 비교적 은밀한 부분이 있다. 바로 바벨이 이런 코드를 만들지 않도록 하는 것이다.
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
이 안에는
Symbol가 포함되어 있는데 Symbol가 틀리지 않도록 전체 국면에서 Symbol 변수를 먼저 설명해야 하기 때문에 비교적 추하다.현재 이러한 ES next 코드는 다음과 같은 코드를 생성합니다.
function fn1() {
if (1) {
let a = 1;
filter(function fn() {
console.log(a);
});
return;
}
}
생성된 코드는 다음과 같습니다.
"use strict";
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
function fn1() {
if (1) {
var _ret = function () {
var a = 1;
filter(function fn() {
console.log(a);
});
return {
v: void 0
};
}();
if ((typeof _ret === "undefined" ? "undefined" : _typeof(_ret)) === "object") return _ret.v;
}
}
이 코드는 어떤 특징이 있습니까?바로
if 블록에 함수를 정의했고 함수에서 if 블록의'블록급 변수'에 접근했으며 if 블록은 return 문장을 사용했다.이를 통해 알 수 있듯이 바벨은
if 블록 내 변수의 작용역을 확보하기 위해 익명 함수를 삽입하고 if 블록에 return 반환이 존재하기 때문에 _ret로 익명 함수의 반환 값을 수신한다.그리고 뒤에 왜 그 긴 쌍_ret의 유형 판단 코드가 생성되었는지 아직 잘 모르겠어요. 바벨의 내부 처리 논리와 결합해서 봐야 할 것 같아요. 생성된 코드만 보면 이것은 완전히 쓸데없는 거예요.광범위하게 보면
for 블록 등 국부 비함수 작용역은 모두 유사한 문제가 있을 것이다.실제로 코드 작성 규범의 측면에서 볼 때 이런 국부 작용 블록에서 함수를 정의해서는 안 된다.함수는 통용되는 코드이어야지 그 작은 덩어리 안으로 축소해서는 안 된다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
