2. JavaScript 기초이론(1) : Class/변수/할당/spread/삼항

1. Class

정의

• 특정 객체를 생성하기 위해, 변수와 함수를 정의하는 일종의 틀
  (객체를 정의하기 위한 상태 + 함수)
• 객체단위 코드를 그룹화하고, 쉽게 재사용하는 용도로 씀
  
  
  

구성

class Cat {
// 생성자 함수
  constructor(name) {
	// 여기서 this는 이 클래스입니다.		
    this.name = name; 
  }

// 함수
  showName(){
	console.log(this.name);
  }
}

let cat = new Cat('perl');
cat.showName();
console.log(cat);

• 생성자함수 : 클래스 인스턴스를 생성하고 생성한 인스턴스를 초기화(초기값을 설정 한다고 생각하기!)하는 역할을 한다.
• 함수 : 어떤 일을 하는 함수이다.
  
  
  
  

클래스를 상속하려면?

• 이미 만들어 둔 어떤 클래스를 가지고 자식 클래스를 만듬.

class Cat {
	// 생성자 함수
  constructor(name) {
		// 여기서 this는 이 클래스입니다.
		this.name = name; 
	}

	// 함수
	showName(){
		return this.name;
	}
}

// extends는 Cat 클래스를 상속 받아 온단 뜻입니다.
class MyCat extends Cat {
	// 생성자 함수
  constructor(name, age) {
		// super를 메서드로 사용하기
		super(name); 
		this.age = age; 
	}
	
	// 부모 클래스가 가진 것과 같은 이름의 함수를 만들 수 있습니다.
	// 오버라이딩한다고 해요.
	showName(){
		// super를 키워드로 사용하기
		return '내 고양이 이름은 '+super.showName()+'입니다.';
	}
	
	showAge(){
		console.log('내 고양이는 '+this.age+'살 입니다!');
	}
}

let my_cat = new MyCat('perl', 4);
my_cat.showName();
my_cat.showAge();

super키워드

1) 메소드로 사용( constructor 안에서 )

• 부모 constructor를 호출하면서 인수를 전달함
• this를 쓸 수 있게 해줌

2) 키워드를 사용할 수 있다.

• 부모 클래스에 대한 필드나 함수를 참조할 수 있음

2. Scope와 let,const

• Scope? 변수의 유효범위

변수

• var : 함수단위
• let : 블록단위(변수:let으로 선언한 변수는 값이 변할 수 있음)
• const : 블록단위(상수:한번 선언한 값은 바꿀 수 있음)
  
  
  
  
  

3. = 과 == 과 ===

• = : 할당
• == : 유형x 비교
• === : 유형o 비교
  
  
  
  
  

4. spread 연산자

어떤 객체안에 있는 요소들을 객체 바깥으로 꺼내줌.

let array = [1,2,3,4,5];
let new_array = [...array];//[1,2,3,4,5]

5. 조건부 삼항 연산자

조건 ? 참일경우 : 거짓일경우

let info = { name : '지선', age : 25 }
let is_me = info.name === '지선' ? true : false ;