>  기사  >  웹 프론트엔드  >  간과하기 쉬운 JS 스크립트 기능_javascript 스킬

간과하기 쉬운 JS 스크립트 기능_javascript 스킬

WBOY
WBOY원래의
2016-05-16 18:02:301023검색
1. 쉽게 무시되는 지역변수
코드를 복사하세요 코드는 다음과 같습니다

var a = 5;
(function(){
alert(a);
var a = a ;
alert(a);
})()
alert (a);

이 코드의 실행 결과를 생각해 보세요.
실행 후 상상한 것과 일치하는지 확인해 보세요.
좋아요, 이 코드의 핵심 지식 포인트는 var a = a입니다. 여기서 두 변수 a는 익명 함수 내부의 지역 변수이고 동일하며 전역 변수 a와 다릅니다.
왜요? ECMA 사양의 변수 선언문 정의를 살펴보겠습니다.
코드 복사 코드는 다음과 같습니다.

설명
변수 문이 FunctionDeclaration 내에서 발생하는 경우
변수는 s10.1.3에 설명된 대로
해당 함수의 함수-로컬 범위로 정의됩니다. 전역 범위
로 정의됨(즉, 10.1.3에서
설명된 대로 전역 개체의 멤버로 생성됨) { DontDelete } 속성을 사용하여 변수는
실행 범위에 진입할 때 생성됩니다. . 블록은 새로운
실행 범위를 정의하지 않습니다. Program 및 FunctionDeclaration만이 새로운
범위를 생성합니다. 변수는 생성 시 정의되지 않은 상태로 초기화됩니다.
VariableStatement는 변수가 생성될 때가 아니라 실행됩니다.

선언에는 다음이 언급되어 있습니다. 범위 환경에 들어가면 변수가 생성되고 초기 값은 정의되지 않습니다. 대입식의 값은 변수가 생성될 때가 아니라 변수 선언문이 실행될 때 변수에 대입됩니다.
위 코드는 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.
var a
a = 5;
(function(){
var a;
alert(a);
a = a ;
alert(a) ;
})()
alert(a)

이해가 더 쉬울 것입니다.

2. 간과하기 쉬운 전역 변수
코드 복사 코드는 다음과 같습니다.
(function(){
var a = b = 5;
})()
alert(b)

이것은 유 아저씨 시절 이전에 공유한 지식 포인트는 상당히 의미가 있으며 여기서도 분석해 보겠습니다.
먼저 실행 결과가 다음과 같은 이유를 생각해 보세요. 5.
그 이유는 var a = b = 5라는 문장에 있습니다.
이 명령문을 심층적으로 분석하기 위해 ECMA 사양의 선언문 정의를 계속 참조합니다.
var a = b = 5는 var a = b = 5; 두 개의 명령문이고 후자는 할당 표현식이며 ECMA에서의 정의는 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.
간단한 할당( = )
제작 AssignmentExpression : LeftHandSideExpression =
AssignmentExpression은 다음과 같이 평가됩니다.
1. AssignmentExpression을 평가합니다. >3. GetValue(Result( 2))를 호출합니다.
4. PutValue(Result(1), Result(3))를 호출합니다.



For a = b = 5; 먼저 사양의 10.1.4항에 따르면 왼쪽의 표현식 a를 실행합니다.


코드 복사 코드는 다음과 같습니다. 실행 중에 구문 생성 PrimaryExpression : Identifier
는 다음 알고리즘을 사용하여 평가됩니다.
1. 범위 체인에 다음 개체가 없으면 5단계로 이동합니다.
2. Result(1)의 [[HasProperty]] 메서드를 호출하여 식별자를
속성.
3. Result(2)가 true인 경우 기본
객체가 Result(1)이고 속성 이름이
인 Reference 유형의 값을 반환합니다. 1단계.
5. 기본 객체가 null이고
속성 이름이

인 Reference 유형의 값을 반환합니다.
스코프 체인을 검색하여 a에 가장 가까운 참조를 찾습니다. 당연히 익명 함수 내부의 스코프에서 찾을 수 있으므로 변수 a가 결정됩니다.
그런 다음 여전히 할당 표현식인 오른쪽의 표현식 b = 5를 실행합니다. 할당 규칙의 첫 번째 단계를 반복합니다. 익명 함수 환경에서는 변수 b가 선언되지 않았으므로 창 전역으로 이동합니다. window.b 를 찾기 위한 환경은 암시적으로 전역 변수로 선언되며 최종적으로 값 5가 할당됩니다. 규칙의 다섯 번째 단계에 따라 표현식의 결과도 a에 할당됩니다. 마지막으로 a와 b는 모두 5입니다. 차이점은 a는 지역 변수이고 b는 전역 변수라는 것입니다.
(function(){var a = b = 5})() 표현식의 전체 실행 순서를 살펴보겠습니다.
1. 익명 함수에 변수 a를 만듭니다.
2. 초기 값은 정의되지 않습니다.
3. 변수 a에 대한 참조를 가져옵니다.
4. 변수 b에 대한 참조를 가져옵니다.
6. b: window.b에 대한 참조
7. b = 5의 결과를 반환합니다. a:
8에 대한 참조는 a = 5입니다. , 중간 단계에서는 변수 b를 전역 변수로 선언합니다. 이를 이해한 후에는 코드의 최적화 지점을 찾는 것이 어렵지 않습니다. 변수 b를 로컬 변수로 명시적으로 선언하기만 하면 됩니다.


(function(){
var a,b;
a = b = 5
})( )

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.