본문 바로가기
Javascript, ES5, ES6

Javascript Object 와 Function 에 관한 정리

by Developer88 2022. 2. 1.
반응형

오늘은 Javascript의 Object(객체)와 Function(함수)에 대해서 정리해 보도록 하겠습니다.

 

1. Object의 생성

Javascript의 Object르 생성하는 방법은 여러가지가 있지만,

다음과 같이 "{"과 "}"을 사용할 수 있습니다.

생성한 object의 property에는 아래와 같이 "." 또는 "[]"를 이용해 접근할 수 있습니다.

 

 

그럼 아래와 같은 log를 볼 수 있습니다.

 

 

2. Object의 값 변경

값을 변경하는 방버도 아래와 같이 간단합니다.

 

 

로그를 찍어보면 true로 값이 변경된 것을 볼 수 있습니다.

 

단순히 property의 값을 변경하는 것 이외에도,

property를 추가할 수도 있습니다.

 

 

로그를 보면, iq라는 property가 추가된 것을 알 수 있습니다.

 

 

 

3. Functions

Function은 자주 사용할 작업의 코드 집합이라고 할 수 있는데요.

자주 사용할 것이므로 미리 만들어 놓아서, 편리하게 사용하도록 하는 것 이지요.

단어의 의미도 기능인데요.

어떤 기능을 하는 코드를 모아서 필요할 때 불러서 사용하는 것 이지요.

 

3-1. Function(함수)의 생성

function(함수)은 function키워드를 이용해서 생성할 수 있는데요.

아래는 텍스트를 보여주는 아주 단순한 형태의 함수입니다.

호출할때는 "()"를 붙여서 호출해 주면 됩니다.

 

 

이제 인자라는 것을 받아서 실행하는 함수를 만들어 보겠습니다.

인자라는 것을 이용하면 함수에 어떤 값을 넣어주고,

그에 따라서 다른 결과를 받을 수 있게 됩니다.

아래에서는 a와 b두개의 인자를 받아서 결과를 console에 볼 수 있게 하였습니다.

이 a와 b는 function의 "{}"안에서 접근할 수 있게 됩니다.

 

 

결과는 11이 로그로 찍게 됩니다.

인자로 들어온 a와 b를 더해서 값을 return받아서 다른 코드에서 사용해주기 위해서는,

return 키워드를 아래와 같이 사용해 주면 됩니다.

이 키워드를 사용함으로서 값을 반납해주고, 함수의 코드는 종료되어집니다.

return 이후의 코드는 실행되지 않는 것 이지요.

 

 

3-2. Object 안의 Function

그럼 이번에는 위에서 정리해 본 Object안에 function을 넣어보겠습니다.

한가지 주의할 점은, Object에 넣을 때는 방식이 조금 다르다는 것 인데요.

아래코드와 같은 방식으로,

add함수를 caculator 객체(object)에 넣어서 사용할 수 있습니다.

 

 

728x90

댓글