Today I Learned

자바스크립트의 객체(Object) 본문

JavaScript

자바스크립트의 객체(Object)

하이라이터 2017. 5. 8. 17:42
728x90

자바스크립트에서 숫자, 문자열, boolean, null, undefined 같은 기본 타입(primitives) 제외한 모든 값은 객체다.

따라서 배열, 함수, 정규 표현식 등도 모두 결국 자바스크립트 객체로 표현된다.

 

  1. 속성(property)

객체는 이름(name) (value) 쌍인 속성 등을 포함하는 컨테이너라고 있다. 속성은 속성명과 속성값으로 구성된다.

  • 속성명 : 문자열을 포함하는 문자열과 숫자
  • 속성값 : undefined 제외한 모든

 

  1. 메서드(Method)

메서드는 객체에 제한되어 있는 함수를 의미한다. 속성값이 함수일 경우, 일반 함수와 구분하기 위해 메서드라 칭한다.

 

 

객체 생성 방법

  1. 객체 리터럴

가장 일반적이고 간편한 자바 스크립트의 객체 생성 방식.

 

중괄호({}) 이용해 객체를 생성한다.

{} 내에 아무것도 기술하지 않으면 객체가 생성된다.

{} 내에 1 이상의 속성명 : 속성값을 기술하면 해당 속성이 추가된 객체가 생성된다.

 

var foo = {

name : 'foo',

age : 27,

sayHello : function() {

console.log('Hi! My name is ' + this.name);

}

};

console.log(typeof foo); //object

console.log(foo); // Object {name: "foo", age: 27, sayHello: function}

foo.sayHello(); // Hi! My name is foo

 

  1. Object() 생성자 함수

new 연산자와 Object() 생성자 함수를 사용하여 객체를 생성할 있다. 객체 생성 이후 속성과 메서드를 추가하여 객체를 완성하는 방법이다.

 

var foo = new Object();

 

foo.name = 'foo';

foo.age=27;

foo.sayHello =  function() {

console.log('Hi! My name is ' + this.name);

};

 

  1. 생성자 함수

생성자 함수를 마치 객체를 생성하기 위한 템플릿처럼 사용하여 속성값이 다른 객체 여러개를 간편하게 생성할 있다.

 

function Foo(name, age) {

var gender='male'; // private

this.name = name; //public

this.age = age; // public

this.sayHello = function() { // public

console.log('Hi! My name is ' + this.name);

};

}

 

var foo1 = new foo('foo', '27');

var foo2 = new foo('bar', '27');

 

 

console.log(foo1.name); //foo

console.log(foo1.gender); //undefined

 

  • 생성자 함수 이름은 일반적으로 대문자로 시작한다. 이것은 생성자 함수임을 인식하도록 도움을 준다.
  • 속성 또는 메서드 앞에 기술한 this 생성자 함수로 생성될 인스턴스(instance) 가리킨다. 따라서 this 연결되어있는 속성과 메서드는 public이다.
  • 생성자 함수 내에서 선언된 일반 변수는 private이다. 생성자 함수 내부에서만 접근이 가능하다.


참고 사이트 : http://poiemaweb.com/js-object


728x90
Comments