es6에서 최상위 객체를 얻는 방법은 무엇입니까?

ES6 최상위 개체를 가져오는 방법: 1. "typeof window !== 'undefine' ? window : (...) ? global : this" 메서드를 사용하여 가져옵니다. 2. "var getGlobal = function () {.. .throw new Error('전역 개체를 찾을 수 없습니다');};" 메서드를 가져옵니다.

이 튜토리얼의 운영 환경: Windows 10 시스템, ECMAScript 버전 6.0, Dell G3 컴퓨터.

es6에서 최상위 객체를 얻는 방법은 무엇인가요? ES6 이전에는 최상위 객체와 전역 변수의 속성이 동일했지만, ES6에서는 최상위 객체와 전역 객체가 분리되기 시작했습니다.

분리하지 않음의 단점

선언되지 않은 변수의 오류는 컴파일 단계에서 보고할 수 없으며 런타임에만 알 수 있습니다.
전역 변수를 모르고도 만들기 쉽다
최상위 객체는 마음대로 읽고 쓸 수 있다.
윈도우 객체는 윈도우를 의미하며, 브라우저의 윈도우 객체를 말한다. 최상위 개체가 엔터티 의미를 갖는 것은 부적절한 디자인입니다. var 및 function 명령으로 선언된 전역 변수는 여전히 최상위 개체의 속성입니다.
let, const 및 class로 선언된 전역 변수는 최상위 객체의 속성이 아닙니다.

최상위 개체

• Browser: 창 개체

Node: 전역 개체
Non-uniform 최상위 개체

브라우저의 최상위 개체는 window, 하지만 Node와 Web Worker는 윈도우를 실행하지 않습니다. 브라우저와 Web Workers에서 self도 최상위 객체를 가리키지만 Node에는 self가 없습니다.

Node에서는 최상위 객체가 전역적이지만 다른 환경에서는 지원되지 않습니다.

Get the top-level object

Limitations

전역 환경에서는 최상위 객체를 반환합니다.

Node 모듈과 ES6 모듈에서는 이를 반환합니다.

function(1) 단순히 함수로 실행하면 최상위 수준으로 반환됩니다.(2) 엄격 모드에서는 정의되지 않은

new를 반환합니다. Function('return this')(); 그러나 브라우저가 CSP를 사용하는 경우 eval 및 새로운 함수 메서드를 사용하지 못할 수 있습니다.

CSP: 콘텐츠 보안 정책, 콘텐츠 보안 정책. 이는 HTTP 헤더 정보 또는 메타 요소를 통해 웹 페이지에 정의된 화이트리스트 메커니즘을 통해 웹 사이트에서 로드하거나 실행하는 리소스에 대해 작동합니다. 하지만 이로 인해 다음과 같은 문제가 발생했습니다.

평가 및 관련 기능이 비활성화되었습니다.

임베디드 JavaScript 코드는 실행되지 않습니다.

원격 스크립트는 화이트리스트를 통해서만 로드할 수 있습니다.

최상위 객체를 얻는 방법

// 方法1
// 针对 浏览器中 顶层对象是window，但是Node和Web Worker没有window。
( 
	typeof window !== 'undefined' ? window : (
		typeof process === 'object' &&
		typeof require === 'function' &&
		typeof global === 'object'
	) ? global : this
);

//方法2
// 针对 浏览器和Web Worker中，self也指向顶层对象，但是Node没有self。
var getGlobal = function () {
	if (typeof self !== 'undefined') { 
		return self; 
	}
	if (typeof window !== 'undefined') {
		return window; 
	}
	if (typeof global !== 'undefined') {
		return global; 
	}
	throw new Error('unable to locate global object');
};

1. [관련 권장사항:
javascript 비디오 튜토리얼
2. ,
웹 프론트엔드
3. ]

위 내용은 es6에서 최상위 객체를 얻는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!