이 기사는 속성 설명자, 데이터 설명자, 액세스 설명자 등을 포함하여 객체지향과 관련된 문제를 주로 소개하는 JavaScript에 대한 관련 지식을 제공합니다. 모두에게 도움이 되기를 바랍니다.
[관련 권장사항: 자바스크립트 동영상 튜토리얼, 웹 프론트엔드]
JavaScript는 실제로 함수형 프로그래밍과 객체 지향 프로그래밍을 포함한 다양한 프로그래밍 패러다임을 지원합니다.
JavaScript의 객체는 힙합 테이블처럼 키와 값으로 구성된 정렬되지 않은 속성 모음 으로 설계되었습니다.
키는 식별자 이름이고 값은 모든 유형, 다른 개체 또는 함수 유형일 수 있습니다.
값이 함수이면 객체의 메서드 라고 부를 수 있습니다.
초기에 객체를 생성하는 가장 일반적인 방법은 Object 클래스를 사용하고 new 키워드를 사용하여 객체를 생성한 다음 속성이나 메서드를 객체에 저장하는 것입니다.
var obj = 새로운 객체()
obj.name = '왜'
console.log(obj.name, obj) // 이유 { 이름: '왜' }나중에 편의상 많은 개발자가 리터럴 형식으로 직접 개체를 만들었습니다.
//리터럴 메소드 var obj2 = { name: 'jam', age: '8' }
console.log(obj) // { 이름: 'jam', 나이: '8' } 이전에는 속성이 객체 내부에서 직접 정의되거나 객체에 직접 추가되었습니다.
그러나 이런 방식으로 이 속성에 일부 제한을 부과할 수는 없습니다. 예를 들어 이 속성은 delect 통해 삭제될 수 있고 for-in 순회 중에 순회될 수 있습니까?
속성에 대해 보다 정확한 운영 제어를 원할 경우 속성 설명자를 사용할 수 있습니다. 개체의 속성은 속성 설명자를 통해 정확하게 추가하거나 수정할 수 있습니다.
속성 설명자는 속성을 추가하거나 수정하려면 Object.defineProperty 사용해야 합니다.
属性描述符分为两种：数据描述符和存取描述符
데이터 설명자는 쓰기 가능하거나 쓰기 불가능할 수 있는 값을 가진 속성입니다. 데이터 설명자에는 다음과 같은 선택적 키 값이 있습니다.
값: 이 속성에 해당하는 값입니다. 유효한 JavaScript 값(숫자 값, 개체, 함수 등)이 될 수 있습니다. 기본값은 정의되지 않습니다.
writable: 이 속성의 쓰기 가능 여부가 true인 경우에만 값은 복사 연산자에 의해 변경될 수 있습니다. 기본값은 거짓입니다.
configurable: 속성의 configurable이 true인 경우에만 속성 설명자가 변경될 수 있으며 해당 객체에서도 속성이 삭제될 수 있습니다. 기본값은 거짓입니다.
enumerable: 속성의 열거 가능 항목이 true인 경우에만 해당 속성이 객체의 열거 속성에 나타날 수 있습니다. 기본값은 거짓입니다.
Object.getOwnPropertyDescriptor() 메서드는 지정된 객체의 고유 속성에 해당하는 속성 설명자를 반환합니다.
Object.getOwnPropertyDescriptor(obj, prop)
obj : 찾을 대상 객체
prop: 대상 객체의 속성 이름(String 유형)입니다.
반환 값: 지정된 속성이 개체에 존재하는 경우 해당 속성 설명자 개체가 반환되고, 그렇지 않으면 정의되지 않은 것이 반환됩니다.
참고: 이 메소드의 첫 번째 매개변수가 객체가 아닌 경우 오류(TypeError)가 보고됩니다.
Object.defineProperty() 메서드는 객체에 새 속성을 직접 정의하거나 객체의 기존 속성을 수정하여 객체를 반환합니다.
Object.defineProperty(obj, prop, 설명자)
obj: 속성이 정의될 개체입니다.
prop: 정의하거나 수정할 속성의 이름입니다.
descriptor: 정의되거나 수정될 속성 설명자
반환값: 함수에 전달된 객체
다음 샘플 코드는 속성 설명자 설정 및 가져오기를 보여줍니다. var obj = {
이름: '잼',
나이: 8
}
Object.defineProperty(obj, '작업', {
값: '변호사'
})
console.log(Object.getOwnPropertyDescriptor(obj, 'age')) // { 값: 8, 쓰기 가능: true, 열거 가능: true, 구성 가능: true }
console.log(obj.job) // 변호사 // DefineProperty를 통한 새 속성, 이 새 속성은 수정, 삭제 및 열거가 불가능합니다. console.log(Object.getOwnPropertyDescriptor(obj, 'job')) / / {값: '변호사', 쓰기 가능: false, 열거 가능: false, 구성 가능: false}
注意：通过defineProperty新增的属性，该新属性是不可修改、不可删除以及不可枚举的
var 객체 = {
이름: '잼',
나이: 8
}
Object.defineProperty(obj, '주소', {
값: '허베이',
// configurable 이 속성은 삭제할 수 없으며, DefineProperty를 사용하여 속성 설명자를 다시 수정할 수 없습니다. configurable: false,
})
delete obj.address // 삭제를 사용하여 이 속성을 삭제하고 싶습니다. obj.address = 'Guangzhou' // obj의 속성 주소 값을 광저우로 수정하고 싶습니다. console.log(obj.address) // 출력 결과: 허베이속성 설명자 구성 가능 값이 false이고 삭제 또는 수정이 불가능하므로 삭제 및 수정이 적용되지 않습니다.
var 객체 = {
이름: '잼',
연령: 8}Object.defineProperty(obj, 'sex', {
값: '남성',
// enumerable은 이 속성을 열거할 수 있는지 여부를 구성합니다. enumerable: true})for (i in obj) {
console.log(i)}열거 가능한 경우: false, 출력 결과는 이름 age입니다.
열거 가능한 경우: true, 출력 결과는 이름 나이 성별입니다.
var 객체 = {
이름: '잼',
연령: 8}Object.defineProperty(obj, 'score', {
값: 80,
// 쓰기 가능: true
쓰기 가능: false})obj.score = 100 console.log(obj.score) // 80writeable 값이 false이므로 점수를 100으로 수정하면 수정이 성공하지 못하고 최종 출력은 80이 됩니다.
한 번에 하나의 속성에 대한 속성 설명자를 설정하는 것이 번거롭다고 생각하시나요? Object.defineProperties가 문제 해결에 도움이 될 수 있습니다.
Object.defineProperties() 메서드는 하나 이상의 새 속성을 정의하거나 객체의 기존 속성을 수정하고 객체를 반환합니다.
Object.defineProperties(obj, props)
obj: 속성이 정의될 개체입니다.
props: 열거 가능한 속성이나 수정된 속성 설명자가 정의될 개체입니다.
반환 값: 함수에 전달된 개체입니다.
샘플 코드는 다음과 같습니다.
var 객체 = {
이름: 'jam',}Object.defineProperties(obj, {
'나이': {
값: 28,
쓰기 가능: 사실,
구성 가능: 거짓,
열거 가능: true
},
'직업': {
값: '변호사',
쓰기 가능: 사실,
구성 가능: 거짓,
열거 가능: true
},
'섹스': {
값: '남성',
쓰기 가능: 거짓,
구성 가능: 거짓,
열거 가능: true
},
'키': {
값: '1.8m',
쓰기 가능: 거짓,
구성 가능: 거짓,
열거 가능: true
}})console.log(obj) // 이름: 'jam', 나이: 28, 직업: '변호사', 성별: '남성', 키: '1.8m' }액세스 설명자는 getter-setter 함수 쌍으로 설명되는 속성입니다. 액세스 설명자에는 다음과 같은 선택적 키 값이 있습니다.
get: 속성에 대한 getter 메서드를 제공합니다. getter가 없으면 정의되지 않습니다. 이 속성에 액세스하면 메서드가 실행됩니다. 메서드가 실행될 때 매개 변수가 전달되지 않지만 this 개체가 전달됩니다.
set: 속성에 대한 setter 메서드를 제공합니다. setter가 없으면 정의되지 않습니다. 이 메서드는 속성 값이 수정될 때 트리거됩니다. 이 메서드는 속성의 새 매개변수 값인 유일한 매개변수를 허용합니다.
configurable: 속성의 configurable이 true인 경우에만 속성 설명자가 변경될 수 있으며 해당 객체에서도 속성이 삭제될 수 있습니다. 기본값은 거짓입니다.
Enurnerable: 속성의 enurnerable이 true인 경우에만 해당 속성은 객체의 열거 속성에 나타날 수 있습니다. 기본값은 거짓입니다.
configurable 및 enurnerable의 사용은 데이터 설명자의 사용과 일치하므로 여기서는 자세히 설명하지 않습니다.
주로 get 및 set 메소드 사용에 대해 이야기합니다.
var 객체 = {
이름: '잼',
나이: 8,
_address: '허베이'
}
// 접근 서술자의 사용 시나리오 // 1. 외부에서 직접 사용하고 할당할 것으로 예상되는 특정 비공개 속성을 숨긴다 // 2. 특정 속성에 접근하고 값을 설정하는 과정을 이해하고 싶다면 , 저장소 속성 설명자 Object.defineProperty(obj, 'address', {
열거 가능: 사실,
구성 가능: 사실,
가져오기: 함수() {
푸()
이 주소를 반환하세요.
},
설정: 함수(값) {
술집()
this._address = 값
}
})
함수 foo() {
console.log("주소 값을 한 번 가로채었습니다.")
}
함수 표시줄() {
console.log("주소의 값은 한 번만 설정됩니다.")
} 위의 샘플 코드 콘솔은 다음 결과를 인쇄합니다. 