JavaScript 오브젝트(Object) 설명

Objects

JavaScript의 대부분이 Object 이다. 내장 객체 뿐만 아니라 사용자 객체 추가도 가능하다.

JavaScript Object

자바스크립트는 여러개의 내장 객체(built-in object)를 지니고 있다. String, Date, Array 등등..

object들은 속성들(properties)과 함수들(methods)로 구성된 특징이 있다.

Objects Properties

Property는 객체와 연관된 값이다. 객체의 속성에 접근하는 방법은 아래와 같은 "점" 연산자를 사용한다.

objectName.propertyName

아래 예제는 문자열의 길이 속성을 이용하여 문자열의 길이를 알아내는 예제이다.

var message="Hello World!";

var x=message.length; // x를 찍어보면 12 이다. 

실생활에서 예를 찾아보면 "사람(person)"이 있다. person은  name, height, weight, age, skin tone, eye color, 등등의 속성을 가지고 있다. 모든 person이 위와 같은 공통적인 속성을 지니고 있지만, 개개인은 모두 다른 속성값을 가지고 있는 것이다.

Objects Have Methods

Method는 object의 액션을 정의한다. 아래와 같은 용법으로 함수를 사용할 수 있다.

objectName.methodName() 

아래는 toUpperCase() 라는 함수를 써서 문자열을 모두 대문자로 만드는 예제이다.

var message="Hello world!";

var x=message.toUpperCase();  // x를 찍어보면 HELLO WORLD! 와 같이 된다.

속성과 마찬가지로 person을 예로 들어 보자. 모든 person이 지니고 있는 공통점은  eat(), sleep(), work(), play() 와 같은 행동양식이 있을 것이다.

Creating JavaScript Objects

자바스크립트 객체를 만들어 내는 방법에는 2가지 패턴이 있다.

1. 객체를 직접적으로 만들고 정의하는 방법.

2. 객체를 정의하는 기능을 이용해서 새로운 객체 인스턴스를 만드는 방법.

직접 만들기 (Creating a Direct Instance)

아래는 새로운 객체를 직접 만든 후에 4가지 속성을 해당 객체에 할당하는 예제이다.

personObj=new Object();

personObj.firstname="John";

personObj.lastname="Doe";

personObj.age=50;

personObj.eyecolor="blue"; 

객체 생성자 사용하기(Using an Object Constructor)

function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
} 

this는 현재 생성되고 있는 객체 자체를 의미한다. 즉, person이라는 생성자 함수가 호출될 때 마다 만들어 지는 object 그 자신을 말하는 것이다. (좀 어려운 개념일 수는 있으나 차근히 보고 반드시 이해하고 넘어가길 바란다.)

객체에 함수 추가하기(Adding Methods to JavaScript Objects)

함수는 생성자 함수 안에 정의하는 방식으로 추가할 수 있다.

function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;

this.changeName=changeName;
function changeName(name)
{
this.lastname=name;
}
} 

changeName() 함수는 lastname 속성에 매개변수(받아온 값:name)을 할당하는 작업을 하는 함수이다.

객체 인스턴스화 하기(Creating JavaScript Object Instances)

객체를 만들수 있는 생성자가 있기 때문에 다수의 객체를 해당 생성자 함수를 통해 만들어 낼 수 있다. 특정한 변수로 객체를 받음으로써 인스턴스화 하는 것이다.

var myFather=new person("John","Doe",50,"blue");
var myMother=new person("Sally","Rally",48,"green"); 

이 자료는 http://w3schools.com 의 글을 발 번역 한 것입니다.