221111 TIL Chapter 06 두번째 시간

06-2 객체의 속성과 메소드 사용하기

 

? 현대 프로그래밍 언어는 모두 객체 지향이라는 패러다임을 기반으로 합니다. 그래서 모든 개발이 객체로 이루어 집니다.

A: 원시언어는 기본자료형 위주였으나, 현대에는 언어가 발전해서 변수 안에 함수, 배열 등을 넣어서 객체를 만들고 인스턴스를 만들어서 다양하고 반복 작업 등을 용이하게 할 수 있게 되었다. 그래서 객체 지향이라고 하고 모든 개발이 객체로 이루어진다고 말할 수 있다.

 

객체 자료형

- 속성과 메소드를 가질 수 있는 모든 것은 객체

- 배열도 객체이므로 속성을 가질 수 있고, 함수도 객체이므로 속성을 가질 수 있다.

 

기본 자료형

- 숫자, 문자열, 불

- 이런 자료형은 속성을 가질 수 없다.

 

기본 자료형을 객체로 선언하기

기본 패턴

const 객체 = new 객체 자료형 이름()

- 자료형을 변환하면 속성을 가질 수 있다.                                                                                                                                                        

- New number()를 사용해서 숫자를 생성하면 숫자와 관련된 연산자도 모두 활용할 수 있으며, 속성과 메소드를 활용할 수 있다.

 

기본 자료형의 일시적 승급

- 기본 자료형에 속성값을 매기면 해당 문장에서는 일시적으로 가지게 되지만 추가되지 않는것이다. 이 점을 유의해야 할것 같다.

 

프로토타입으로 메소드 추가하기

- prototype 객체에 속성과 메소드를 추가하면 모든 객체에서 해당 속성과 메소드를 사용할 수 있다.

기본 패턴

객체 자료형 이름.prototype.메소드 이름 = function () {

}

제곱연산자 

기본 패턴

// 2를 한번 제곱 (2 * 2)
> 2 ** 2
4
// 2를 두번 제곱 (2 * 2 * 2)
> 2 ** 3
8
// 2를 세번 제곱 (2 * 2 * 2 * 2)
> 2 ** 4
16

예제

    <script>
      // power() 메소드를 추가합니다.
      Number.prototype.power = function (n = 2) {
      // this ** n을 해도 계산이 되지만 객체 내부에서 값을 꺼내 쓰는 것임을 명확하게 하기 위해서 valueOf()메소드를 사용했고 이것이 일반적임.
        return this.valueOf() ** n
      }

      // Number 객체의 power() 메소드를 사용합니다.
      const a = 12
      console.log('a.power():', a.power())
      console.log('a.power(3):', a.power(3))
      console.log('a.power(4):', a.power(4))
    </script>

 

indexOf() 메소드

- 문자열 내부에 어떤 문자열이 있는지, 배열 내부에 어떤 자료가 있는 지 확인 할 때 사용

- 문자열이 있으면 해당 문자열이 시작하는 위치의 인데스를 출력, 없으면 -1을 출력

- "문자열.indexOf(문자열) >= 0" 을 사용하면 문자열 내부에 찾는 문자열이 있으면 true, 없으면 false

- "문자열.contain(문자열)" 했을때 true 또는 false를 리턴하는 형태로 변경하면 편리하게 사용가능

예시

    <script>
      // contain() 메소드를 추가합니다.
      String.prototype.contain = function (data) {
        return this.indexOf(data) >= 0
      }

      Array.prototype.contain = function (data) {
        return this.indexOf(data) >= 0
      }

      // String 객체의 contain() 메소드를 사용합니다.
      const a = '안녕하세요'
      console.log('안녕 in 안녕하세요:', a.contain('안녕'))
      console.log('없는데 in 안녕하세요', a.contain('없는데'))

      // Array 객체의 contain() 메소드를 사용합니다.
      const b = [273, 32, 103, 57, 52]
      console.log('273 in [273, 32, 103, 57, 52]:', b.contain(273))
      console.log('0 in [273, 32, 103, 57, 52]:', b.contain(0))
    </script>

 

Number 객체

 

숫자 N번째 자릿수까지 출력하기: toFixed()

- 소수점 이하 n번째 자리까지만 출력하고 싶을때는 : toFixed(n)

> const l = 123.456
undefined

// n+1의 자릿수에서 반올림한다.
> l.toFixed(2) = 
"123.46"

 

NaN과 Infinity 확인하기: isNaN(), isFinite()

- 숫자 자료 뒤에 온점을 찍고 사용하는 것이 아니라 Number 뒤에 점을 찍고 사용함

- NaN(Not a Number) : 숫자가 아닌 경우 true

- isFinite(): 숫자가 유한한 숫자인 경우 true

-Number 객체와 관련된 메소드 참고 링크: https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Number

Number - JavaScript | MDN

 

String 객체

문자열 양쪽 끝의 공백 없애기: trim()

문자열을 특정 기호로 자르기: split()

- 이외에도 length, indexOf()등이 있음

- 더 많은 메소드 참고 링크 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String

String - JavaScript | MDN

 

JSON 객체

- JavaScript Object Notation의 약자

- 자바스크립트의 객체처럼 자료를 표현하는 방식

- JSON 형식의 추가 규칙

• 값을 표현할 때는 문자열, 숫자, 불 자료형만 사용할 수 있음.(함수 등은 사용불가)
• 문자열은 반드시 큰따옴표로 만들어야 함.
• 키key에도 반드시 따옴표를 붙여야 함.

오늘은 여기까지

총평

오늘 git 강의가 아주 큰 수확이었다. sourcetree를 사용하니 이렇게 편할 줄이야. 그리고 미니프로젝트 전에 git을 친숙화하는게 좋겠다는 아이디어도 괜찮았던것 같다. 진도는 어차피 나갈이고 그전에 git때문에 로스된 경험이 있어서 생각해본것이다. 현재 배운 개념들을 아직 조각 조각 산재해 있는 느낌이다 이게 결국에는 퍼즐이 끼워맞춰지지 않을까 아직까지는 아주 재밌다.