Javascript_javascript 스킬 삭제 소개

1. 질문 제기

먼저 다음 코드를 살펴보겠습니다. 다음 코드는 브라우저의 개발자 도구(예: FireBug)에서 사용하면 안 됩니다. , Chrome 개발자 도구) 실행, 이유는 나중에 설명합니다:

개체의 속성을 삭제할 수 있는 이유:

코드 복사 코드는 다음과 같습니다.

var o = { x: 1 }
delete o.x; // true
o.x; 🎜>

단, 이렇게 삭제하지는 마세요. 변수는 이렇게 선언합니다.

코드 복사 코드는 다음과 같습니다.

var x = 1;
delete x; // false
x; // 1

다음과 같이 정의된 함수도 삭제할 수 없습니다. >

코드 복사 코드는 다음과 같습니다.

function x(){}

delete x ; // false
typeof x; // "function"


참고: 삭제 연산자가 true를 반환하면 삭제할 수 있다는 뜻이고, false를 반환하면 삭제할 수 없다는 의미입니다. 삭제

이를 이해하려면 먼저 변수 인스턴스화 및 속성 특성과 같은 개념을 숙지해야 합니다. - 안타깝게도 일부 JavaScript 책에서는 이러한 내용이 거의 언급되지 않습니다. 이를 이해하는 것은 어렵지 않으며, 왜 그런 방식으로 작동하는지 관심이 없다면 이 부분을 건너뛰어도 됩니다.


2. 코드 유형
ECMAScript에는 세 가지 유형의 실행 코드가 있습니다. 전역 코드(global code), 함수 코드(function code) 및 Eval 코드( code Eval에서 실행됨).

코드 복사 코드는 다음과 같습니다.

var x=1;//글로벌 코드

function test(){
var y=2;//함수 코드
eval("var z=3");//함수의 평가 코드
}
eval("function evalTest() {}");//전역의 평가 코드

3. 실행 컨텍스트
ECMAScript 코드가 실행되면 항상 특정 실행 컨텍스트에 있습니다. 이는 범위 및 변수 인스턴스화가 작동하는 방식을 이해하는 데 도움이 되는 다소 추상적인 엔터티입니다. 세 가지 유형의 실행 코드 각각에 대해 실행 컨텍스트가 있습니다. 함수가 실행될 때 제어는 함수 코드의 실행 컨텍스트에 들어가는 것이라고 할 수 있습니다. 글로벌 코드가 실행되면 글로벌 코드(Global code)의 실행 컨텍스트로 들어갑니다.

보시다시피 실행 컨텍스트는 논리적으로 스택에서 나옵니다. 첫째, 코드는 자체 범위를 갖는 함수를 호출할 수 있으며, 함수는 다른 함수를 호출할 수 있습니다. 함수가 자신을 재귀적으로 호출하더라도 각 호출은 새로운 실행 컨텍스트로 들어갑니다.


4. 활성화 객체/변수 객체

각 실행 컨텍스트에는 가변 객체가 있습니다. 실행 컨텍스트와 마찬가지로 Variable 객체는 변수 인스턴스화 메커니즘을 설명하는 데 사용되는 추상 엔터티입니다. 흥미로운 점은 코드에 선언된 변수와 함수가 실제로 이 변수 ​​개체의 속성으로 추가된다는 것입니다.
전역 코드의 실행 컨텍스트에 들어갈 때 변수 객체로 전역 객체를 사용합니다. 이것이 전역 범위에 선언된 변수나 함수가 전역 개체의 속성이 되는 이유입니다.

코드 복사 코드는 다음과 같습니다.

/* `this`는 다음을 참조한다는 점을 기억하세요. 전역 범위에 있는 경우 전역 개체 */

var GLOBAL_OBJECT = this;

var foo = 1
GLOBAL_OBJECT.foo; // 1
foo === GLOBAL_OBJECT.foo; true

function bar(){}
typeof GLOBAL_OBJECT.bar; // "함수"
GLOBAL_OBJECT.bar === bar; // true


전역 변수는 전역 객체의 속성이 되지만, 함수 코드에 정의된 지역 변수는 어떻게 되나요? 동작은 실제로 매우 유사합니다. 즉, 변수 개체의 속성이 됩니다. 유일한 차이점은 함수 코드에서 변수 개체가 전역 개체가 아니라 소위 활성화 개체라는 것입니다. 함수 코드가 실행 범위에 들어갈 때마다 활성화 개체가 생성됩니다.

함수 코드의 변수와 함수는 활성화 객체의 속성이 될 뿐만 아니라 함수의 각 매개변수(형식 매개변수에 해당하는 이름)와 특정 Arguments 객체도 속성이 됩니다. 활성화 개체는 내부 메커니즘이며 실제로 프로그램 코드에 의해 액세스되지 않습니다.

코드 복사 코드는 다음과 같습니다.

(function(foo){

var bar = 2;
function baz(){}

/*
추상적으로 말하면

특수 `arguments` 객체는 함수 활성화를 포함하는 속성이 됩니다. object:
ACTIVATION_OBJECT.arguments; // 인수 객체

...또한 인수 `foo`:
ACTIVATION_OBJECT.foo; // 1

...as 변수 `bar`:
ACTIVATION_OBJECT.bar; // 2

...그리고 로컬로 선언된 함수:
typeof ACTIVATION_OBJECT.baz; /

})(1);

마지막으로 Eval 코드에서 선언된 변수는 호출 컨텍스트의 변수 개체의 속성으로 생성됩니다. 평가 코드는 호출되는 실행 컨텍스트의 변수 개체만 사용합니다.

코드 복사 코드는 다음과 같습니다.

var GLOBAL_OBJECT =

/ * `foo`는 호출 컨텍스트 변수 객체의 속성으로 생성됩니다.
이 경우 전역 객체입니다. */

eval('var foo = 1;'); >GLOBAL_OBJECT.foo; // 1

(function(){

/* `bar`는 호출 컨텍스트 변수 객체의 속성으로 생성됩니다. 이 경우에는 포함된 함수의 활성화 개체 */

eval('var bar = 1;');

/*
추상적으로는
ACTIVATION_OBJECT.bar; 🎜>* /

})();



5. 속성 특성

이제 변수에 어떤 일이 일어날지 분명합니다. 속성), 남은 유일한 것은 이해해야 할 개념은 속성입니다. 각 속성에는 ReadOnly, DontEnum, DontDelete 및 Internal 속성 세트의 0개 이상의 속성이 있습니다. 이를 선택적인 속성인 태그로 생각할 수 있습니다. 오늘 토론에서는 DontDelete 속성에만 관심이 있습니다.
선언된 변수와 함수가 변수 개체(활성화 개체(함수 코드) 또는 전역 개체(전역 코드))의 속성이 되는 경우 생성된 이러한 속성에는 DontDelete 속성이 있습니다. 그러나 명시적으로(또는 암시적으로) 생성된 속성에는 DontDelete 특성이 없습니다. 이것이 일부 속성은 삭제할 수 있고 일부 속성은 삭제할 수 없는 이유입니다.



코드 복사

코드는 다음과 같습니다. var GLOBAL_OBJECT =

/ * `foo`는 전역 개체의 속성입니다.

변수 선언을 통해 생성되므로 DontDelete 속성이 있습니다. */

var foo = 1;
delete foo; // false
typeof foo; // "number"

/* `bar`는 전역 개체의 속성입니다. 함수 선언을 통해 DontDelete 속성이 있습니다.
그래서 삭제할 수 없습니다. */

function bar(){}
delete bar // false
typeof bar; ; // "함수"

/* `baz`도 전역 개체의 속성입니다.
그러나 속성 할당을 통해 생성되므로 DontDelete 속성이 없습니다.
삭제할 수 있습니다. */

GLOBAL_OBJECT.baz = 'blah';
delete GLOBAL_OBJECT.baz; // true
typeof GLOBAL_OBJECT.baz; >


6. 내장 속성 및 DontDelete


한마디로: 속성의 고유 특성(DontDelete)은 이 속성을 삭제할 수 있는지 여부를 제어합니다. 개체의 기본 제공 속성(즉, 개체의 미리 정의된 속성)에는 DontDelete 특성이 있으므로 삭제할 수 없습니다. 특히 Arguments 변수(또는 현재 알고 있듯이 활성화 객체의 속성), 모든 함수 인스턴스의 length 속성에도 DontDelete 속성이 있습니다.

코드 복사

코드는 다음과 같습니다.

(function(){

/* DontDelete가 있으므로 `인수`를 삭제할 수 없습니다. */

인수 삭제; // false
인수 유형 ; // "객체"

/* 함수의 `length`를 삭제할 수 없습니다. DontDelete도 있습니다. */

function f(){}
delete f.length; / false
typeof f.length; // "number"

})()

함수 매개변수에 따라 생성된 속성에도 DontDelete 속성이 있습니다. 또한 삭제할 수도 없습니다.

코드 복사 코드는 다음과 같습니다.

(function(foo, bar){

delete foo; // false
foo; // 1

delete bar; // false
bar; 1, 'blah');

7. 선언되지 않은 할당
단순히 선언되지 않은 할당은 전역 객체 속성에 삭제 가능한 객체를 생성합니다.

코드 복사 코드는 다음과 같습니다.

var GLOBAL_OBJECT =

/ * 변수 선언을 통해 전역 속성 만들기; 속성에 DontDelete가 있음 */
var foo = 1;

/* 선언되지 않은 할당을 통해 전역 속성 만들기 */
bar = 2;/ /window.bar=2로 이해될 수 있습니다. 위의 다섯 번째 항목에 따르면 삭제가 가능합니다.

delete foo; // false
typeof foo; >
delete bar; // true
typeof bar; // "undefine"


DontDelete 속성은 속성 생성 프로세스 중에 결정되며 이후 할당은 수정되지 않습니다. 존재의 본질을 이해하는 것이 중요합니다.

코드 복사 코드는 다음과 같습니다. /* `foo`는 다음과 같이 생성됩니다. DontDelete가 포함된 속성 */

foo(){}

/* 이후 할당은 속성을 수정하지 않습니다. */
foo = 1; / false
typeof foo; // "number"

/* 하지만 존재하지 않는 속성에 할당하면
빈 속성이 있는 해당 속성이 생성됩니다(따라서 DontDelete가 없음). */

this.bar = 1;
delete bar; // true
typeof bar; // "정의되지 않음"

8.
Eval에서 생성된 변수나 메서드는 특별하며 DontDelete 속성이 없으므로 삭제할 수 있습니다.

코드 복사

코드는 다음과 같습니다.

eval("var x = 1;" ); console.log(x); // 1 delete x; console.log(typeof x); // 정의되지 않음

eval("function test( ){ var x=1; console.log(delete x);/* false */;return 1;}");

console.log(test()); // 1
delete test;
console .log(typeof test); // 정의되지 않음　


여기서 Eval에서 생성된 변수나 메소드에는 위의 빨간색 부분과 같이 메소드 내부에 변수나 메소드가 포함되지 않습니다. 코드, 여전히 앞서 말한 것과 동일합니다. 삭제할 수 없습니다.


9. FireBug에 대한 혼란

FireBug에서 실행된 코드의 결과를 살펴보겠습니다.



코드 복사

코드는 다음과 같습니다.

var x=1 delete x console.log(typeof x); //정의되지 않음 function y(){

var z=1;

console.log(delete z);//false
}
y(); delete y;
console.log(typeof y);//undefine


위의 규칙에 위배되는 것은 분명하지만 위의 8번째 항목과 비교해 보면 다음과 같습니다. eval에서 실행되는 코드의 효과. 확인되지는 않았지만 FireBug(Chrome 개발자 도구)의 콘솔 코드는 eval을 사용하여 실행되는 것으로 추측됩니다.

따라서 JS 코드를 테스트할 때 현재 컨텍스트와 관련된 경우 특별한 주의를 기울여야 합니다.


10. 삭제 연산자로 삭제된 객체

C에도 포인터가 가리키는 객체를 삭제하는 삭제 연산자가 있습니다. 예:



코드 복사


코드는 다음과 같습니다.

class Object { public : Object *x; } Object o;

o.x = new Object()

delete o.x; 라인이 출시됩니다


그런데 자바스크립트의 삭제는 C와 다릅니다. o.x가 가리키는 객체를 삭제하는 것이 아니라, o.x 속성 자체를 삭제하는 것입니다.

코드 복사 코드는 다음과 같습니다.

var o =
o.x = new Object();
delete o.x; // 이전 줄의 새 Object 객체가 여전히 존재합니다.
o.x; // 정의되지 않았으며, o의 x라는 속성이 삭제되었습니다.

실제로 Javascript에서는 o.x를 삭제한 후 Object 객체의 참조가 손실되어 가비지 수집되므로 o.x를 삭제하는 것은 o.x가 가리키는 객체를 삭제하는 것과 "동등"하지만 이 작업은 ECMAScript 표준이 아닙니다. 즉, 구현이 Object 객체를 전혀 삭제하지 않더라도 ECMAScript 표준을 위반하지 않습니다.

"객체 삭제가 아닌 속성 삭제"는 다음 코드로 확인할 수 있습니다.

코드 복사 코드는 다음과 같습니다.

var o =
var a = { x: 10 };
o.a = a;
delete o.a; // o.a 속성이 삭제됩니다.
o.a; // 정의되지 않음
a.x; : 10 } 객체 남아 a로 참조되므로 재활용되지 않습니다

또한 delete o.x는 delete o["x"]로 쓸 수도 있으며 둘 다 동일합니다. 효과.

11. 기타 삭제할 수 없는 속성

위에서 언급한 삭제할 수 없는 내장 속성(예: 사전 정의된 속성) 외에도 프로토타입 삭제할 수 없습니다:

코드 복사 코드는 다음과 같습니다:

function C () { this.x = 42; }
C.prototype.x = 12;
C.prototype.y = 13;

var o = new C(); ; // 42, 함수에 정의된 o.x

delete o.x; //true는 자체적으로 정의된 x를 삭제합니다.
o.x; // 12, 프로토타입에 정의된 o.x는 삭제되지 않습니다. o.x가 다시 실행됩니다

delete o.y; //true, o 자체에는 o.y 속성이 없고 y는 프로토타입 체인에 존재하므로 객체 자체 속성과 프로토타입 속성이 다르다는 뜻입니다
o.y; //13

요약

너무 많은 말을 했지만 JavaScript의 삭제를 이해하는 데 도움이 되기를 바랍니다. 제한된 수준으로 인해 완전히 정확하다는 보장은 없습니다. 오류가 발견되면 수정하십시오.

원문은
　1.
http://perfectionkills.com/understanding-delete/(영어)　2.
http://nanto .asablo .jp/blog/2008/01/09/2552470(일본어)
이 기사는 http://jscode.cnblogs.com에 처음 게시되었습니다.