JavaScript 객체

1 개요

JavaScript Object
자바스크립트 객체
  • 객체도 변수와 동일하지만 여러가지 값을 담을 수 있는 변수라 생각하면 됨
  • 자바스크립트에서 객체(속성과 행위를 가지는 것)를 만들어 사용할 수 있음
  • 문자, 숫자, 함수, 객체 등 모든 것들이 객체가 될 수 있음
  • {, } 사이에 기입
  • name : value 의 쌍으로 입력 가능

2 프로퍼티

  • {}를 통해 name과 age의 프로퍼티를 가지는 객체 생성 및 초기화
JavaScript
Copy
var person = {name:JohnJeong, age:45};
var person2 = {name:jmnote, age:35};

3 프로퍼티+메소드

  • {}를 통해 name과 color의 프로퍼티와 bark메소드를 가지는 객체 생성 및 초기화
JavaScript
Copy
var dog = {
  name: "Snoopy",
  color: "white",
  bark: function bark() {
    console.log("Woof!");
  }
};
console.log( dog.name );
// Snoopy
dog.bark();
// Woof!

4 예시 3: new

  • new 키워드를 통해 Dog 객체 생성
JavaScript
Copy
function Dog(name) {
  this.name = name;
  this.bark = function() {
    console.log("Woof!");
  }
}
var myDog = new Dog("snoopy");
myDog.bark();
// Woof!

5 예시 4: new Object()

  • new Object() 키워드를 통해 객체 생성
  • {}와 동일함
JavaScript
Copy
var dog = new Object();
dog.name = "Woody";
dog.age = 5;
JavaScript
Copy
var dog = {};
dog.name = "Woody";
dog.age = 5;

6 실전 예시

JavaScript
Copy
function Dog(name) {
  this.name = name;
  this.bark = function() {
    console.log("Woof! I'm " + this.name +".");
  }
}
var myDog = new Dog("Snoopy");
myDog.bark();
// Woof! I'm Snoopy.
JavaScript
Copy
var Dog = function(name) {
  this.name = name;
}
Dog.prototype.bark = function() {
  console.log("Woof! I'm " + this.name +".");
}
var myDog = new Dog("Snoopy");
myDog.bark();
// Woof! I'm Snoopy.
JavaScript
Copy
var Dog = function(name) {
  var name;
  var Dog = {
    name: name,
    bark: function() {
      console.log("Woof! I'm " + this.name +".");
    }
  }
  return Dog;
}
var myDog = new Dog("Snoopy");
myDog.bark();
// Woof! I'm Snoopy.

7 같이 보기

8 참고 자료