CSS

Object

토픽 CSS > JavaScript

Object 객체는 객체의 가장 기본적인 형태를 가지고 있는 객체이다. 다시 말해서 아무것도 상속받지 않는 순수한 객체다. 자바스크립트에서는 값을 저장하는 기본적인 단위로 Object를 사용한다. 

var grades = {'egoing': 10, 'k8805': 6, 'sorialgi': 80};

동시에 자바스크립트의 모든 객체는 Object 객체를 상속 받는데, 그런 이유로 모든 객체는 Object 객체의 프로퍼티를 가지고 있다.

또한 Object 객체를 확장하면 모든 객체가 접근할 수 있는 API를 만들 수 있다. 아래는 Object 객체를 확장한 사례다.

Object.prototype.contain = function(neddle) {
    for(var name in this){
		if(this[name] === neddle){
			return true;
		}
	}
	return false;
}
var o = {'name':'egoing', 'city':'seoul'}
console.log(o.contain('egoing'));
var a = ['egoing','leezche','grapittie'];
console.log(a.contain('leezche'));

그런데 Object 객체는 확장하지 않는 것이 바람직하다. 왜냐하면 모든 객체에 영향을 주기 때문이다. 

확장 후에 아래 코드를 실행해보자.

for(var name in o){
    console.log(name);	
}

결과

name
contain

확장한 프로퍼티인 contain이 포함되어 있다. 객체가 기본적으로 가지고 있을 것으로 예상하고 있는 객체 외에 다른 객체를 가지고 있는 것은 개발자들에게 혼란을 준다. 이 문제를 회피하기 위해서는 프로퍼티의 해당 객체의 소속인지를 체크해볼 수 있는 hasOwnProperty를 사용하면 된다. 

for(var name in o){
    if(o.hasOwnProperty(name))
		console.log(name);	
}

hasOwnProperty는 인자로 전달된 속성의 이름이 객체의 속성인지 여부를 판단한다. 만약 prototype으로 상속 받은 객체라면 false가 된다. 

댓글

댓글 본문
  1. 코딩박
    2023.11.16. JavaScript 입문 수업 - 객체지향 - Object 파트 수강했습니다.
  2. DreamBoy
    2023.10.17. JavaScript 입문 수업 - 객체지향 - Object 파트 수강했습니다.
  3. 늦은개발자
    23.07.30 Object 객체는, 모든 객체의 최상위 prototype이라고 생각하면 된다.
  4. 진진리
    22.05.13
  5. 낀찐
    2022. 02. 06 완료
  6. pmxsg
    2021.12.18 수강
  7. 드림보이
    2021.12.12. Object 파트 수강완료
  8. GelandeWagen
    ok
  9. Grit
    감사합니다.
  10. seaWater
    2021. 9. 29. 완료
  11. choi
    완료
  12. labis98
    20210822 good!!!
  13. JustStudy
    이고잉님의 강의는 참 많은 면에서 배웁니다. 고맙습니다.
  14. 낭만고양이
    수강완료
  15. Amousk
    좋은 강의 감사합니다.
  16. hanel_
    감사합니다
  17. object는 가장 상위 객체이며 이를 활용해 하위객체들을 또한 동일한 메소드를 활용가능하다.
    모든 객체들은 .prototype이라는 메소드를 가지고 있는데, 여기에 프로퍼티나 메소드를 상속받는다.(이걸로 상속 받을 것을 선택가능)
    'object.prototype.~' -> 모든객체가 활용가능
    'object.~' - > 하위객체는 사용불가능
  18. 강승
    감사합니다.
  19. 박병진
    감사합니다.
  20. CODING
    완료
  21. ironia
    수고하셨습니다~
  22. 한강
    편안한 주말 되시길~~!!!
    200404
  23. 굼벵이
    완료
  24. 홍주호
    20191103 완료
  25. 정홍
    완료
  26. 박창신
    완료
  27. 호두
    hasOwnProperty
    고맙습니다
  28. choon
    감사합니다.
  29. 미완성
    20190109
  30. pakimchi
    built-in property는 순환되지 않고 사용자 정의 property만 순환에 포함됩니다.

    https://javascriptweblog.wordpress.com......ps/
    대화보기
    • 송유진
      Object.prototype.contain = function~~ 으로 지정한 속성이 왜 생성한 객체를 출력시킬 때 출력되나요? 이미 Object.prototype을 정의된 다른 속성들도 많은데 왜 직전에 정의한 contain만 하나 더 출력되는건지 궁금합니다. 제가 영상을 제대로 이해를 못한건지 ㅠㅠ흠..
    • 스탐
      감사합니다.
    • 정말
      감샤합니다
    • 동아대학교
      명강의 감사합니다! 동아대화이팅!
    • 민..직
      두번째 강의가 ㄹㅇ 명강의
    • 피자
      마지막 동영상 5:11, for문 부분에 a.hasOwnProperty(name)의 name 이 객체 o 의 name을 가리키는 건지, 어떤 것을 가리키는 건지 헷갈릴 수도 있겠네요

      for(var name in a) 의 name을 다른 걸로 대입하셨으면 덜 헷갈렸을텐데

      물론, 제가 개념을 정확히 숙지하지 못한 것도 있겠죠
    • 피자
      이고잉님 말씀대로 js를 배우면 배울수록 어렵네요
    • 피자
      좋은 강의 잘 듣고있습니다~
      그런데 시스템 소리 최대로 높이고, 유튜브 볼륨 소리를 최대로 높여도 소리가 너무 작은데
      동영상자체의 소리가 좀 많이 작은 것 같아요~
    • 옥슬이
      두번째꺼 넘 어렵네요 ㅠㅠ
      조금 더 쉽게 설명을 할 수 있을 것 같은데..
      좀 아쉽다고 해야하나.. 뭐 아닐 수도 있지만
    • moon
      감사합니다.
    • 이재호
      그러게요... 저도 동일한 고민을 하고 있네요
      대화보기
      • 우니운
        재밌네요 ㅎㅎ 감사합니다
      • 서동화
        그럼 사전에 prototype 의 출력을 막아버리는 기능이 있을 것 같은데요. 왜냐면 다른 프로토타입들은 출력이 않되는 걸로 봐서... 뭔가 프로토타입도 속성을 정의내릴 수 있을 것 같다는 생각.
      • 코딩잘하고싶어요 ㅎ
        전체를 이해하려하지 말고 전체적인 흐름만 따라간다는 생각으로...*^^*
      • 김진홍
        감사합니다!
      • Jupi
        임지훈님의 정리댓글의 [ Object.메소드이름()이 Object자신만 쓸수 있다는것] 은,
        Object.keys(*객체*);
        이렇게 쓰는것을 말하는 것 아닐까요??
        대화보기
        • 박인호
          12-20
          수강완료.
          감사합니다. 함수(생성자)가 정의 될 때 그 함수의 프로토타입 객체라는 것이 함수와 함께 생성되고,
          어떤 객체의 __proto__라는 속성이 객체가 만들어 질 때 참조한 프로토타입객체를 링크한다
          라는 개념으로 접근하면 좀 더 쉽게 이해가 가는 것 같습니다.(저로서는요)
          저는 아래의 링크를 참조 했습니다.
          http://www.nextree.co.kr/p7323/
        • 고스트프리
          완료했습니다.
        • GoldPenguin
          완료했습니다.
        • 대화보기