Data 종류 식별 → Data 처리

이때 종류 식별을 프로그래밍 단계에서 미리 처리하겠다 → 자료형

typeof 연산자 → 변수의 자료형을 알 수 있는 연산자

동등 연산자, 일치 연산자 (가급적 일치 연산자를 사용할 것)

• 동등연산자 : 자동으로 자료형을 일치시킨 뒤 비교

• 일치연산자 : 자료형도 비교 대상에 포함

  //동등 연산자
  1 == "1" -> true
  
  //일치 연산자
  1 === "1" -> false
  

원시 타입

• Boolean : 참 혹은 거짓

• Number : (정수든 소수든) 숫자형

• String : 문자열 (문자들의 배열 : 인덱스에 매칭되는 데이터의 집합)

  주의 사항) 문자열은 한번 선언되면 그 문자열 자체는 변경 불가능

  var name = "TOM";
  name[2] = "P"; -> 변경 불가능
  console.log(name); //출력시 TOM이 출력됩니다.
  

  • 문자열을 다루는 다양한 메서드

    • length : 문자열의 길이를 반환하는 메서드 (띄어쓰기/공백도 길이로 인정됩니다.)

      var str = "hello string!";
      console.log(str.length);        // 13
      

    • search : 문자열 중 문자열을 찾는 메서드

      문자열.search("찾는 문자열");
      
      var str1 = "Hello World";
      var str2 = "안녕하세요 자바스크립트";
      str1.search("wor"); -> -1 (대소문자도 구분합니다.)
      str1.search("Hello"); -> 0
      str2.search("자바스크립트"); -> 6(공백도 구분합니다.)
      str2.search("Hello"); -> -1 (없다면 -1을 반환합니다.)
      

    • slice : 문자열 일부 추출하는 메서드

      • 음수를 사용할 수 있으며 뒤에서부터 문자열을 자를 때 유용합니다.

      slice("시작 위치", "종료 위치")
      slice("시작 위치")
      
      var str = '자바스크립트';
      var result1 = str.slice(0, 2);
      // 결과 : "자바"
      
      var result2 = str.slice(2, 6);
      // 결과 : "스크립트"
      
      var result3 = str.slice(2);
      // 결과 : "스크립트"
      
      var result4 = str.slice(-4);
      // 결과 : "스크립트"
      
      var result5 = str.slice(-4, 5);
      // 결과 : "스크립"
      
      var result6 = str.slice(2, -1);
      // 결과 : "스크립"
      

    • replace : 문자열 일부를 바꾸는 메서드

      replace("기존문자열", "바꾸고자하는 문자열");
      
      var str = "hello string!";
      str.replace("hello", "goodbye");    // goodbye string!
      

    • concat : 문자열끼리 합치는 메서드

      string변수1.concat(string변수2,...);
      
      var str1 = 'Java';
      var str2 = 'Script';
      var res = str1.concat(str2);
      // 결과 : 'JavaScript'
      
      var str1 = 'Java';
      var str2 = 'Script';
      var str3 = ' ';
      var str4 = 'Developer';
      var res = str1.concat(str2, str3, str4);
      // 결과 : 'JavaScript Developer'
      
      const str1 = 'Hello';
      const str2 = 'World';
      const result = str1.concat(' ', str2);
      console.log(result); // "Hello World"
      

    • indexOf : 문자열 속의 문자열 검색

      • 만약 검색할 문자열이 있다면 그 문자열이 시작되는 인덱스(검색할 문자열이 시작되는 인덱스)가 반환됩니다. 검색할 문자열이 없다면 -1이 반환됩니다.

        indexOf(검색할 문자열)
        
        var str = "hello string!";
        str.indexOf("hello");           // 0
        str.indexOf("string!");          // 6
        str.indexOf("javascript");      // -1
        

    • toLowerCase,toUpperCase

      • toUpperCase:대문자로 변경

      • toLowerCase:소문자로 변경

        var str = "hello string";
        str.toLowerCase();          // HELLO STRING
        str.toUpperCase();          // hello string
        

• Null : 아무 값도 갖지 않음을 뜻하는 자료형

  • 대소문자 유의 null 입니다.(NULL → X / Null → X)

  • null 타입 검사 시에는 === (일치연산자) 사용하기하기

    var a = null;
    typeof a; -> object //a의 자료형을 검사하면 null이 나와야 하는데 object가 나옴
    a === null; -> true // a의 자료형을 확인하기 위해 일치 연산자 사용
    

• Undefined

  • 변수를 선언하고 값 할당을 안 한 경우 존재하지도 않은 객체로 접근했을 경우

• Symbol

+null VS undefined

• null : 명시적으로 없음
• undefined : 진짜로 아무것도 없음

+number,string,boolean 자료형은 메서드로 다룰 수 있다고 하는데…?

→ 원시타입 자료형을 감싸주는 객체인 Wrapper 객체(Number,String,Boolean,Symbol)가 존재합니다.

→ 따라서 number,string,boolean 자료형으로 만든 변수들에 대해 메서드를 사용할 수 있습니다. 또한 new를 사용해서 number,string,boolean 객체를 생성할 수도 있습니다.

var num = new Number(123);
console.log(num);       // 123

var str = new String("hello");
console.log(str);       // hello

var bool = new Boolean(true);
console.log(bool);      // true

→ 이렇게 생성한 Wrapper 객체(num,str,bool)은 각각 숫자 내장함수, 문자열 내장함수, boolearn 내장함수를 적용할 수 있습니다.

Number.isInteger(123)   //true
str.length              // 5

객체 타입

• 자바스크립트는 객체 기반의 스크립트 프로그래밍 언어

• 객체 : 키와 그에 매칭되는 값(데이터⇒속성,property) 혹은 동작(Method)의 집합

• 객체의 구조

  object = {
  	key1 : 'key1에 매칭되는 데이터(property)',
  	key2 : 'key2에 매칭되는 데이터(property)',
  	method1 : function() {
  			//method는 함수로 정의
  	}
  }
  
  key1 / key2 / method1 등은 문자열 or 문자 기호
  
  key1에 매칭되는 데이터 / key2에 매칭 되는 데이터 / function()은 모든 자료형
  

• 예제

  var osClass = {
      name : "운영체제",
      professor : "이동희",
      classno : 2 , // 모든 자료형이 들어갈 수 있습니다.
      printInfo : function () { // 함수 사용시 다음 내용이 입력됩니다.
          console.log(this.name + "강의" + this.classno + "분반입니다. 교수는" + this.professor+"입니다");
      }
  }
  

  

• 객체 이름에 접근하기

  • 키값에 접근하기 : 객체이름.키값;
  • 메서드(함수)에 접근하기 : 객체이름.메서드이름함수();

• 객체 다루기

  • 키값 추가하기 : 객체이름.새로운_키 = 값;
  • 키값 삭제하기 : delete 객체이름.삭제하고_싶은키;
  • 특정 객체 key 확인하기1 : Object.keys(객체이름);
  • 특정 객체 key 확인하기2 : for (key in osClass); → for~in으로 객체 순회하기

+proto

• 자바스크립트는 객체가 만들어지기 위해 자신을 만드는데 사용된 원형인 프로토타입 객체를 이용하여 객체를 만들게 되는데 이때 만들어진 객체 안에 proto(비표준) 속성에 자신을 만들어낸 원형을 의미하는 프로토타입 객체를 참조하는 링크가 있다. 이 링크를 프로토타입이라고 정의한다.

  

+for ~ in 문

• 객체와 배열가 반복 할 수 있는 대상입니다.

  for 반복제어변수 in 반복할수있는대상{
  		//반복제어변수로 반복하여 수행할 일
  }
  

  • 객체 접근

  const obj = { a: 1, b: 2, c: 3 };
  
  // obj 객체를 순회하며 obj 의 key를 담는다
  for (const property in obj) {
      console.log(property);
  }
  
  // 결과
  // a
  // b
  // c
  
  //key값 접근
  //for ( 반복제어변수 in 객체 ) {
  //			반복제어변수
  //}
  
  for (const property in obj) {
      console.log(obj[property]);
  }
  
  // 결과
  // 1
  // 2
  // 3
  
  //value 접근
  //for(반복제어변수 in 객체) {
  //       객체[반복제어변수]
  //}
  

  • 배열 접근

    const arr = [1, 2, 3, 4, 5];
    for (x in arr) {
        console.log(`index ${x}, value ${arr[x]}`);
    }
    
    // 결과: 배열의 인덱스 출력
    // index 0, value 1
    // index 1, value 2
    // index 2, value 3
    // index 3, value 4
    // index 4, value 5