JavaScript 기초 지식 - (대상)

7799 단어 웹 전단
JavaScript 의 모든 사물 은 대상, 문자열, 숫자, 배열, 날짜 등 입 니 다. JavaScript 대상 은 속성의 무질서 한 집합 으로 볼 수 있 습 니 다. 모든 속성 은 하나의 키 값 쌍 입 니 다. JavaScript 대상 은 자체 속성 을 유지 할 수 있 을 뿐만 아니 라 원형 이 라 고 불 리 는 대상 에서 속성 을 계승 할 수 있 습 니 다.대상 의 방법 은 통상 적 으로 계승 하 는 속성 인 데 이런 '원형 식 계승' 은 자 바스 크 립 트 의 핵심 특징 이다
1, 처음 만난 상대
대상 의 가장 흔 한 용법 은 생 성, 설정, 찾기, 삭제, 검 측 과 매 거 진 속성 입 니 다.속성 은 이름과 값 을 포함 합 니 다.속성 명 은 빈 문자열 을 포함 하 는 임의의 문자열 일 수 있 으 며, 속성 값 은 임의의 자 바스 크 립 트 값 일 수 있 습 니 다.이름과 값 을 제외 하고 모든 속성 은 이와 관련 된 값 이 있 습 니 다. 속성 특성 이 라 고 합 니 다. (1) 쓸 수 있 습 니 다. 속성 을 바 꿀 수 있 는 값 (2) 을 설정 할 수 있 는 지 여 부 를 표시 합 니 다. for / in 순환 을 통 해 이 속성 (3) 을 설정 할 수 있 는 지 여 부 를 표시 합 니 다.이 속성 을 세 번 이나 수정 할 수 있 는 지 여 부 를 나타 내 는 대상 마다 세 개의 관련 대상 특성 (1) 대상 의 원형 을 가지 고 있 습 니 다. 다른 대상 을 가리 키 며 본 대상 의 속성 은 원형 대상 (2) 대상 의 클래스 를 계승 합 니 다. 하나의 표지 대상 유형의 문자열 (3) 대상 의 확장 태그 입 니 다. 이 대상 에 새로운 속성 을 추가 할 수 있 는 지 여 부 를 가 리 킵 니 다.
2, 대상 생 성
(1)      
    var obj = {x:1,b:2}  
(2)   new    
    var obj = new Array()  
    var date = new Date()  
(3)   Object.create()    
    var obj = Object.create()

3, 원형 이해
모든 자 바스 크 립 트 대상 (null 제외) 은 다른 대상 과 연결 되 어 있 습 니 다. '다른' 대상 은 우리 가 잘 아 는 원형 입 니 다. 모든 대상 은 원형 에서 속성 을 계승 합 니 다.대상 으로 직접 만 든 대상 은 모두 같은 원형 대상 을 가지 고 있 으 며, Object. prototype 을 통 해 원형 대상 에 대한 인용 을 얻 을 수 있 습 니 다.new 를 통 해 만 든 대상, 원형 은 구조 함수 의 prototype 속성의 값 입 니 다. 예 를 들 어 Array. prototype, Date. prototype.원형 대상 이 없 는: Object. prototype 은 그 중 하나 입 니 다.일반 대상 은 모두 원형 을 가지 고 있 습 니 다. Array. prototype 의 속성 은 Object. prototye 에서 계승 합 니 다. 따라서 new Date () 가 만 든 Date 대상 의 속성 은 Date. prototype 과 Object. prototye 를 동시에 계승 합 니 다. 이것 이 바로 원형 체인 입 니 다.
4. 속성의 조회 와 설정
점 (.) 또는 괄호 ([]) 를 통 해 얻 을 수 있 습 니 다. 예 를 들 어 obj. a 또는 obj ['a'] 는 속성 값 을 얻 을 수 있 습 니 다. ECMAScript 3 에서 연산 자 를 누 른 식별 자 는 보존 자 를 사용 할 수 없습니다. ES5 는 제한 을 완 화 했 습 니 다. 흔히 볼 수 있 는 두 가지 예외 상황: 대상 속성 명 은 닫 힌 키 글자 이 므 로 중 괄호 로 만 접근 할 수 있 습 니 다. 속성 명 이 불확실 한 매개 변수 라면.그러면 중 괄호 로 만 접근 할 수 있 습 니 다.
5, 속성 삭제
delete 연산 자 는 자유 속성 만 삭제 할 수 있 고 계승 속성 을 삭제 할 수 없 으 며 설정 할 수 없 는 속성 도 삭제 할 수 없습니다. 반환 값 은 true 또는 false 입 니 다.
6, 속성 검사
어떤 속성 이 대상 에 존재 하 는 지 판단 하려 면 in 연산 자, hasOwnProperty () 와 proerty IsEnumerable () 방법 (1) in 연산 자 (자체 속성 과 계승 속성 검출) 를 통 해
var obj = { x: 1, y: 2}
 "x" in obj
 //       ,     ,                    ,  true

(2) hasOwnProperty () 함수 (자체 속성 검출)
var obj = { x:1, y:2}  
    obj.hasOwnProperty('x')
// hasOwnProperty()              ,         

(3) property IsEnumerable () 은 hasOwnProperty () 의 증강 판 으로 자체 속성 이 감지 되 고 이 속성의 매 거 성 이 true 일 때 만 true 로 돌아 갑 니 다.
7, 매 거 속성
매 거 속성: for - in 순환.for - in 순환 은 순환 체 에서 대상 에서 매 거 진 모든 속성 을 옮 겨 다 닐 수 있 습 니 다. 자체 속성 과 계승 속성 을 포함 하여 속성 이름 을 순환 변수 에 할당 할 수 있 습 니 다. 기억 하 십시오. 대상 이 계승 하 는 내장 방법 은 매 거 진 것 이 아 닙 니 다.
var obj = { x:1, y:2, z:3};                //           
    obj.propertyIsEnumerabel('toString')  // =>false     
    for(item in obj) {
        console.log(item)                //   :x,y,z,  toString
    }
//   :                
for(item in obj){
    if(!obj.hasOwnProperty('item')
    continue;   //        
}
for(item in obj) {
    if(typeof obj[item] === 'function') {
        continue;  //     
    }
}

for - in 순환 외 에 도 두 가지 방법 (1) Object. keys () 이 있 습 니 다. 한 배열 을 되 돌려 줍 니 다. 이 배열 은 대상 에서 매 거 진 속성 이름 으로 구성 되 어 있 습 니 다 (2) Object. getOwn Property Names () 는 배열 을 되 돌려 줍 니 다. 대상 의 모든 소속 성 이름 만 되 돌려 줍 니 다. 매 거 진 속성 뿐만 아니 라 매 거 진 속성 도 포함 되 어 있 습 니 다.
8, 속성 getter 와 setter
대상 속성 은 이름, 값, 그룹 특성 으로 구성 되 어 있 습 니 다.속성 값 은 하나 또는 두 가지 방법 으로 대체 할 수 있 습 니 다. 이 두 가지 방법 은 getter 와 setter 입 니 다. '액세스 기 속성' 이 라 고 부 릅 니 다.데이터 속성 은 간단 한 값 만 있 습 니 다.데이터 속성 과 마찬가지 로 액세스 기 속성 도 계승 할 수 있 습 니 다.
9, 속성의 특성
하나의 속성 은 하나의 이름과 네 개의 특성 을 포함한다 고 볼 수 있다.
  • 데이터 속성 4 가지 특성: 값 (value), 쓰기 가능 (writable), 매 거 진, 설정 가능
  • 액세스 기 속성: 가 져 오기 (get), 쓰기 (set), 매개 성, 설정 성 속성 특성 을 실현 하기 위 한 조회 와 설정 작업, ES5 는 '속성 설명자' 대상 데이터 속성 을 정의 하 는 설명자 대상 속성 은 value, writable, enumerable, configurable 액세스 기 속성의 설명자 대상 속성: get, set, enumerable,configurable 는 Object. getOwnProperty Descriptor () 를 호출 하면 특정 속성의 속성 설명 자 를 가 져 올 수 있 습 니 다
  • var obj = { x:1, y:2, z:3};
    console.log(Object.getOwnPropertyDescriptor(obj, 'x'))
    //   : {value:1, writable:true, enumerable:true, configurable: true}
    

    액세스 기 속성: {set: undefined, get: function, enumerable: true, configurable: true} Object. getOwnProperty Descriptor () 는 고유 속성 만 얻 을 수 있 습 니 다. 속성 을 계승 하 는 특성 을 얻 으 려 면 프로 토 타 입 체인 을 옮 겨 다 녀 야 합 니 다. Object. getPrototypeOf () 로 속성 특성 을 설정 하거나 새 속성 이 어떤 특성 을 가지 고 있 는 지: Object. definePeoperty () 로
        var obj = {};
        Object.defineProperty(obj, 'x',{
        	value: 'zlm',
        	writable: true,     //    
        	enumerable: false, //    
        	configurable: true
        })
        console.log(obj.x) // => zlm       
        console.log(Object.keys(obj)) // =>[]     ,        []
        Object.defineProperty(obj,'x', {
        	writable:false
        })
        obj.x = 222;
        console.log(obj.x)  // =>zlm,     ,       
        Object.defineProperty(obj, 'x',{
        	value: 444
        })
        console.log(obj.x) // =>444        ,       
        Object.defineProperty(obj, 'x', {
        	get: function() {
        		return 555;
        	}
        })
        console.log(obj.x) // =>555  x             
    

    메모: Object. defineProperty () 는 계승 속성 을 수정 할 수 없 으 며, 동시에 여러 속성 을 수정 하거나 만 들 려 고 합 니 다. 사용: Object. defineProperties ()
    //       :      
    //       :     ,                   
      var p = Object.defineProperties({},{
      	x: {value:1,writable:true,enumerable:true,configurable:true},
      	y: {value:2,writable:true,enumerable:true,configurable:true},
      	z: {
      		get: function() { return this.x * this.x + this.y *this.y },
      		enumerable:true,
      		configurable: true
      	}
      })
      console.log(p.x , p.y , p.z)
    

    속성 특성 복사
    Object.defineProperty(Object.prototype, 'extentd', {
      	writable:true,
      	enumerable: false,
      	configurable:true,
      	value: function(o) {
      	   //  o          
      		var names = Object.getOwnPropertyNames(o)  
      		for(var i =0; i< names.length; i++) {
      			if(names[i] in this) continue
      			//   o        
      			var desc = Object.getOwnPropertyDescriptor(names[i])
      			//                
      			Object.defineProperty(this,names[i],desc)
      		}
      	}
      })
    

    10, 대상 은 세 속성
  • 원형
  • 확장 성 (1) 원형 속성 은 인 스 턴 스 대상 생 성 초기 에 설정 되 었 습 니 다. 대상 을 통 해 직접 만 든 대상 입 니 다. 원형 은 Object. prototype () 이 new 를 통 해 만 든 대상 입 니 다. 원형: 구성 함수. prototype 이 Object. create () 를 통 해 만 든 대상 입 니 다. 원형 은 첫 번 째 매개 변수 가 한 대상 이 다른 대상 의 원형 인지 확인 하려 고 합 니 다.통과: isPrototypeOf () 방법 예 를 들 어 p. isPrototypeOf (o) 에서 p 가 o 의 원형 인지 (2) 류 의 속성 으로 대상 을 얻 는 방법: 대상 의 toString () 방법 을 호출 하여 8 번 째 와 꼴찌 두 번 째 문자
  • 를 추출 합 니 다.
    function classof(o) {
    	if(o === null) return "NULL";
    	if(p === undefined) return "Undefined";
    	return Object.prototype.toString.call(o).slice(8, -1)
    	}
    	classof({})
    	classof(null)
    	classof("")
    	classof(false)
    	classof([])
    	classof(new Date())
    	classof(/,/)
    	classof(window)
    

    (3) 대상 의 확장 성 은 대상 에 게 새로운 속성 을 추가 할 수 있 는 지 여 부 를 표시 합 니 다. 모든 내 장 된 대상 과 사용자 정의 대상 은 확장 가능 한 ES5 를 표시 합 니 다. 대상 을 조회 하고 설정 할 수 있 는 확장 가능 한 함 수 를 제공 합 니 다. Object. esExtensible () 설정 대상 은 확장 할 수 없습니다. 폐쇄 된: Object. preventExtensions (), Object. seal () 검사 대상 이 폐쇄 되 었 는 지 여부: Object. isSealed ()더 엄격 한 잠 금 대상, 동결: Object. freeze () 검사 대상 동결 여부: Object. isFrozen ()
    11. 대상 의 서열 화
    대상 의 직렬 화 란 대상 의 상 태 를 문자열 로 변환 하고 문자열 을 대상 ES5 로 복원 할 수 있 는 내장 함 수 를 제공 합 니 다. JSON. stringify () 는 직렬 화, JSON. parse () 는 대상 을 복원 합 니 다.

    좋은 웹페이지 즐겨찾기