4장 객체와 배열, 함수의 기초 & 5장 표현식과 연산자

객체란 이름과 값을 한 쌍으로 묶은 데이터를 여러 개 모은 것이다.

 

객체의 구조는 흔히 이름(key)와 값(value)로 이루어져 있고, 객체의 데이터 한 쌍을 객체의 프로퍼티라고 한다.

 

<객체의 구조>

객체를 생성하는 방법은 2 가지가 있다.

1. 객체 리터럴
2. 생성자 함수

---

1. 객체 리터럴

var card = {suit: “하트”, rank: “A”}

위에서 중괄호{}로 쌓여 있는 부분이 객체 리터럴이다. 해당 코드는 객체 리터럴을 card라는 변수에 대입하였다. 키와 값은 콜론( : )으로 구분하고 프로퍼티들은 쉼표( , )로 구분한다.

 

• 객체의 프로퍼티 값으로 모든 타입이 올 수 있다. 즉, 객체의 값으로 객체와 함수 모두 사용 가능하다는 의미이다.
• 객체는 참조 타입이다. 객체가 생성되면 메모리의 한 영역을 차지하고, 그 객체를 변수에 대입하면 해당 객체의 메모리 위치 정보가 변수에 저장된다.

1-1. 함수

함수란 일련의 처리를 하나로 모아 언제든 호출할 수 있도록 만들어 둔 것이다.

함수는 입력을 받은 후에 함수 안의 프로그램에서 작업을 수행하고 수행한 결과의 값을 반환한다.

 

이때, 함수에게 전달되는 입력 값을 인수, 함수 정의문의 인수를 인자, 함수의 출력값을 반환값이라고 한다.

function square(x) {return x*x}

//함수명 : square 
//인자(parameter) : x
//반환값 : x*x

square(5)

//인수(argument) : 3

 

• 객체의 프로퍼티 중에서 함수를 값으로 갖고 있는 프로퍼티를 메서드라고 한다!

함수(메서드) 활용의 장점

• 재사용 가능 : 똑같은 동작을 여러번 반복해야 할 때, 해당 동작을 함수로 만들어서 사용할 수 있다.
• 프로그램 이해도 상승 : 반복되는 동작을 하나의 함수로 작성하면 코드가 간결해지고 자연스럽게 코드를 쉽게 이해할 수 있게 된다.
• 수정 용이 : 어떤 동작을 수정해야할 때 해당 동작이 곳곳에 있는게 아니라 하나의 함수로 되어있기 때문에 하나의 함수만 수정하됨 된다.

---

2. 생성자 함수

 

• 생성자 함수는 객체를 여러개 생성할 때 사용하는 함수이다.
• new 연산자와 함께 사용하여 객체를 생성한다.
• 인스턴스란 생성자와 new 연산자로 생성한 객체를 의미한다.

내장 생성자 & 내장 객체

• 자바스크립트에 처음부터 포함되어 있는 생성자 및 객체가 있다.
• 모든 자바스크립트 환경에서 실행 가능하다.
• 단 내장 생성자는 객체로 만들어준 후에 사용이 가능하고 내장 객체는 바로 사용이 가능하다.
• 내장 생성자  및 객체에는 자바스크립트 내에서 유용하게 사용되는 프로퍼티와 메서드가 포함되어 있기 때문에 해당 내용을 사용하여 다양한 작업을 쉽게 처리할 수 있다.
• 내장 생성자 및 객체의 종류는 해당 페이지에서 확인 가능하다 : developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects

---

자바스크립트의 객체는 3가지로 나눌 수 있다.

<객체의 종류>

• Native 객체 : ECMAScript 사양에 정의된 javascript가 자체적으로 가지고 있는 객체를 의미한다. 즉, 내장객체와 내장생성자로 만들어진 객체들이다.
• 호스트 객체 : 실행 환경에서 제공하는 객체이다. (OS, Web browser에 따라 제공 객체 달라짐)
• 사용자 정의 객체 : 사용자가 직접 만든 객체가 사용자 정의 객체이다.

---

배열이란, 인덱스 값으로 이루어진 테이블을 의미한다. 배열 역시 객체의 일종이다.

배열의 인덱스는 0부터 시작하고 값은 객체와 마친가지로 모든 타입이 올 수 있다.

 

<배열의 구조>

---

5장 표현식과 연산자

해당 부분은 내용적인 설명보다 코드상에서 바로 내용 확인이 가능하도록 업데이트 해 두었다.

 

 

관련 코드 정리 : github.com/Jungeun-Pyun/Javascript_study