정보실

웹학교

정보실

javascript JavaScript에서 delete 연산자 이해

본문

delete는 객체에서 특정 속성을 제거하는 데 사용됩니다.


https://blog.bitsrc.io/understanding-the-delete-operator-in-javascript-3791ba6f3a08 


delete 연산자

ECMA 사양에 따름


Delete (O, P)


이것은 객체의 특정 속성을 제거하는 데 사용됩니다. 속성을 구성 할 수 없는 경우 예외가 발생합니다.


오퍼레이션은 인수 O 및 P와 함께 호출됩니다. 여기서 O는 오브젝트이고 P는 속성 키입니다.


delete 연산자는 객체의 속성을 제거하거나 삭제하는 데 사용됩니다.


const l = console.log
let obj = {
"d": 88
}
l(obj.d)
delete obj.d
l(obj.d)


값이 88 인 속성 d를 가진 객체 obj가 있습니다. 

먼저, d 속성의 값을 기록하면 88이 출력됩니다. 

그런 다음 속성을 출력하려고 할 때 delete 연산자를 사용하여 속성을 제거합니다. undefined 표시


$ node delete
88
undefined 


undefined는 JS의 기본 유형으로 아직 값이 없음을 의미합니다. 

변수가 정의되었지만 값이 할당되지 않았습니다. 

따라서 delete 연산자를 통해 속성을 삭제하면 속성 값이 undefined를 반환합니다.


팁 : 유틸리티 및 UI 구성 요소 공유 및 재사용 


비트를 사용하여 다른 JavaScript 프로젝트에서 작은 개별 모듈을 쉽게 게시, 설치 및 업데이트하십시오. 재사용 가능한 작은 모듈로 더 빠르게 빌드 할 수 있는 경우 전체 라이브러리를 설치하지 말고 코드를 복사하여 붙여 넣지 마십시오. 


1*khzSvcvQfKy0mrxjy_gdvQ.gif 


구성 할 수 없는 속성 및 삭제 


delete 연산자는 구성 가능한 개체에서만 작동합니다. delete는 구성 할 수 없는 객체의 속성을 제거 할 수 없습니다.


우리의 obj 객체는 구성 가능했기 때문에 d 속성을 제거 할 수 있었습니다. 구성 할 수 없는 개체를 정의하면 해당 속성을 삭제할 수 없습니다


let obj = {
"d": 88
}
Object.defineProperty(obj, 'd', { configurable: false });l(obj.d)
delete obj.d
l(obj.d)
$ node delete
88
88


출력을 참조하십시오. 속성이 삭제되지 않았습니다. 우리는 Object # defineProperty 메소드를 사용하여 d 속성을 구성 할 수 없게 만들고 구성 가능을 false로 설정하여 트릭을 수행했습니다.


기본적으로 개체의 속성은 구성 가능하도록 설정되어 있습니다.


let obj = {
"d": 88
}
l(Object.getOwnPropertyDescriptor(obj, "d"))$ node delete
{ value: 88,
writable: true,
enumerable: true,
configurable: true }


var, let, const 및 delete 


var, let 및 const는 구성 할 수 없는 속성을 선언합니다. 따라서 var, let 또는 const로 선언 된 변수는 전역 범위에서 제거 할 수 없습니다.


const l = console.log
var f = 90
let g = 88
const h = 77
l("before delete f: " + f)
l("before delete g: " + g)
l("before delete h: " + h)
function func() {
let funh = 990
delete funh
l(funh)
delete f
delete g
delete h
l("inside func f:" + f)
l("inside func g:" + g)
l("inside func h:" + h)
}
func()
delete f
delete g
delete h
l("after delete f: " + f)
l("after delete g: " + g)
l("after delete h: " + h)


산출: 


$ node delete
before delete f: 90
before delete g: 88
before delete h: 77
990
inside func f:90
inside func g:88
inside func h:77
after delete f: 90
after delete g: 88
after delete h: 77 


delete 연산자로 삭제 한 후 모두 동일하게 유지되었습니다.


functions and delete 


delete 연산자로 함수를 삭제할 수 없습니다


function func() {
l("inside func")
}
delete func
func()


산출: 


$ node delete
inside func 


객체 속성으로 정의 된 함수는 삭제할 수 있습니다.


var obj = {
d: function() {
l("inside obj d function")
}
}
obj.d()
delete obj.d
obj.d()


산출: 


$ node delete
inside obj d function
delete.js:14
obj.d()
^
TypeError: obj.d is not a function


그러나 구성 불가능으로 정의되면 삭제할 수 없습니다.


const obj = {
d: function() {
l("inside obj d function")
}
}
obj.d()
Object.defineProperty(obj, "d", { configurable: false })
delete obj.d
obj.d() 


산출: 


$ node delete
inside obj d function
inside obj d function 


delete 및 글로벌 범위 


var 없이 전역 범위에서 변수를 정의 할 때 let 또는 const :


f = 90 


이 변수 f는 구성 적입니다 :


f = 90
l(Object.getOwnPropertyDescriptor(global, "f")) 


산출: 


$ node delete
{ value: 90,
writable: true,
enumerable: true,
configurable: true } 


delete 연산자로 삭제할 수 있습니다.


f = 90l(f)
delete f
l(f)


산출: 


$ node delete
90
l(f)
^
ReferenceError: f is not defined


 ReferenceError가 발생합니다.


delete and local scope 


delete는 로컬 범위 및 함수 범위에 영향을 미치지 않습니다.


{
var g = 88
delete g
}
l(g)
function func() {
var funch = 90
delete funch
l(funch)
}
func()


산출: 


$ node delete
88
90 


delete 및 존재하지 않는 속성 


존재하지 않는 속성이 삭제되도록 전달되면 오류가 발생하지 않습니다. 그냥 true를 반환합니다.


var obj = {
"d": 90
}
l(delete obj.f)


산출: 


$ node delete
true 


delete 및 프로토 타입 체인 


객체에서 삭제해도 프로토 타입 체인이 내려 가지 않습니다.

function Foo() {
this.bar = 90
}
Foo.prototype.bar = 88
var f = new Foo()


Foo의 자체 속성 막대와 동일한 이름 표시 줄의 프로토 타입 속성에 막대가 있습니다.


Foo의 막대는 객체를 통해 참조 될 때 반환됩니다.


f.bar // 90 


bar 속성을 삭제할 때 :


...
delete f.bar 


프로토 타입이 아닌 Foo의 막대 만 삭제합니다. 따라서 삭제 후 막대를 다시 참조하면 프로토 타입의 막대가 반환 됩니다.


...
l(f.bar)
delete f.bar
l(f.bar) 


산출: 


$ node delete
90
88 


delete 및 JS 내장 정적 특성 


delete 연산자는 Array, Math, Object, Date 등과 같은 JS API의 정적 내장 속성을 제거 할 수 없습니다.


l(delete Math.PI) 


산출: 


$ node delete
false 


배열에서 delete 및 그 특성 


JS의 모든 유형은 JSObject에서 C ++에 해당하는 것을 상속합니다. JS의 Objects에서 정의한 각 속성은 C ++ JSObject의 멤버 변수입니다.


obj = {
"d": 90,
"f": 88
}
JSObject {
d -> 90
f -> 88
}


이제 Arrays도 JSObject입니다. 차이점은 JSObject의 내용이 Array의 내용으로 정의되지 않는다는 것입니다. 그것들은 내용의 수에 의해 정의됩니다.


obj = [90, 88]JSObject {
0: 90
1: 88
}


그래서 우리는 숫자 obj [1]로 배열을 참조합니다. 숫자는 객체에서와 같은 속성입니다.


위의 obj 배열에는 0과 1의 두 가지 속성이 있습니다.


l(obj[0]) // 90
l(obj[1]) // 88 


우리가 delete로 객체에 했던 것처럼 배열에서도 가능합니다.


obj의 첫 번째 요소를 삭제하려면 다음을 수행하십시오.


delete obj[0] 


값 90을 제거합니다.


l(oj[0]) // undefined 


그러나 배열 수를 줄이지 않습니다.


l(obj.length) // 2
delete obj[0]
l(obj.length) // 2 


이것이 배열에 구멍을 남깁니다.


// obj
index: 0 1
[ , 88 ] 


객체에서도 delete 연산자는 속성을 제거하지 않고 속성 값만 제거 / 삭제하여 정의되지 않은 상태로 둡니다.


배열의 구멍을 채울 수 있습니다.


obj[0] = 100
l(obj[0]) // 100 


결론 


delete 연산자의 기능을 보았습니다. 구성 가능 및 구성 불가능한 요소에 미치는 영향. 전역 및 로컬 범위에 미치는 영향, 배열 홀리 요소에 대한 영향.


이를 통해 JS 앱에서 delete 연산자를 사용할 때 더 편안하고 주의를 기울일 수 있습니다.



페이지 정보

조회 51회 ]  작성일19-11-10 13:19

웹학교