Object (객체)

이진경·2019년 10월 2일
0

[javascript] : 객체 (object)

  • 자바스크립트는 사실상 객체기반의 스크립트 언어고 자바스크립트를 이루고 있는거이 모든것들이 객체로 존재.
    객체의 기본개념은 데이터(주채)와 그 데이터에 관련되는 동작/정보를 모두 포함하고 있는 개념이고
    그 자신의 정보를 가지고 있는 독립적인 주체이다.

  • 객체의 모양은 하기와 같음

let plan1 = {
//plan1은 객체명이고 시작은 {}(중괄호)로 감싸면서 시작,
  name: "Basic",
//name은 property이름이고 "basic"은 property값이고 property 값에는 어느 type이나 가능
(string, number, array, object, function..)
  price: 3.99,
  space: 100,
  transfer: 1000,
  pages: 10
// property 이름은 중복될 수 없고 property이름과 property값 사이에 :(콜론)으로 구분.
property를 추가할 때는 ,(쉼표)를 붙여준다

//다시 말하면 객체는 이름과 값으로 구성된 프로퍼티들의 집합이라고 할 수 있다.
};
  • 객체 property값에 접근하려면..?
<example 1>
let plan1 = {   
  name: "Basic"
};

console.log(plan1.name);
//접근하려는 객체명은 왼쪽에 프로퍼티명은 오른쪽에 (.) 연산자 사용해서 접근
console.log(plan1["name"]);
//접근하려는 객체명은 왼쪽에 프로퍼티명은 대괄호 안에 쌍따옴표("")로 접근
<example 2>
let plan1 = {   
  name: "Basic"
};

let propertyName = "name";

console.log(plan1[propertyName]);
// plan1객체의 name이라는 프로퍼티에 접근하기. 대괄호 안에는 변수가 들어 갈 수 있!!
  • 프로퍼티는 객체의 속성을 나타내는 접근 가능한 이름과 활용 가능한 값을 가지는 특별한 형태
    그래서 객체가 가진 정보에 직접적으로 접근할 수 있
<example 3>
let myObj = {
  property1: "hello",
  property2: [1,2,3,4,5],
  property3: {
    childproperty: "haha"
  }
};

let name = "property";
//변수name에 "property"할당

console.log(myObj[name+"1"]);
//myObj의 변수name에 +"1"해줘서 property1값에 접근, 콘솔에 'hello'나옴

console.log(myObj[name+"2"]);
//myObj의 변수name에 +"2"해줘서 property2값에 접근, 콘솔에 [1,2,3,4,5] 찍힘

console.log(myObj[name+"3"]);
//myObj의 변수name에 +"3"해줘서 property3에 접근, 콘솔에 {
    childproperty: "haha"
  } 나옴
  
console.log(myObj[name+"3"]["child"+name]);
//myObj의 변수name에 +"3"해줘서 property3에 접근 후 그 property이름 ("child"에 name (=property) +해주어서
콘솔에 'haha' 나옴
let myObj = {
  property1: "hello",
  property2: [1,2,3,4,5],
  property3: {
    childproperty: "haha"
  }
};

let name = "property1";
//name변수에 "property1" 재할당

myObj[name] = ["hi", "hello"];
console.log(myObj);
// myObj객체 첫번째 property1값이 "hello"-> [ 'hi', 'hello' ]로 바뀜

console.log(myObj.property1[0]);
// index 0을 접근해서 'hi'만 나옴
let objData = {
  name: 50,
  address: { 
    email: "gaebal@gmail.com",
    home: "위워크 선릉2호점"
  },
  books: {
    year: [2019, 2018, 2006],
    info: [{
      name: "JS Guide",
      price: 9000
    }, {
      name: "HTML Guide",
      price: 19000,
      author: "Kim, gae bal"
    }]
  }
};

//HTML Guide"에 접근하고 싶을 때
let bookName = objData.books.info[1].name;
: objData의 books에 접근>info의 [1]번쨰의 name에 접근..(헥헥)
console.log(bookName);

//하기와 같이 books가 아니라 book이라고 적게 되면 
해당 property명은 존재하지 않아서 값이 없고,  그래서 콘솔에 undefined라고 나옴
let bookName = objData.book.info[1].name;
console.log(bookName);
: Cannot read property 'info' of undefined
  • 프로퍼티는 값이 할당되지 않으면 존재할 이유가 없...
    객체의 정보를 담고 있어야할 요소가 그 어떤 정보도 할당받지 않았다면 객체로서 해당 프로퍼티는 쓸모가 없다.
    프로퍼티를 추가하면서 값을 할당하지 않으면 syntax error. 프로퍼티를 추가 할때 이점을 반드시 주의**

0개의 댓글