Unit2. [JavaScript] 기초

* Programming = Date Prosessing 

Chapter1. 변수

학습목표

• 변수 사용은 데이터를 편리하게 저장하고 꺼내 쓰는 것임을 이해한다.
• 자바스크립트에서 변수의 선언과 값의 할당에 대해서 설명할 수 있다.
• =가 "같다"라는 의미가 아니라 할당 연산자임을 이해한다.
• 크롬 개발자 도구의 console 탭을 이용하여 원하는 값을 출력할 수 있다.
• 변수를 사용하여 보다 효과적으로 구구단을 출력할 수 있다.

1-1 변수 (이름을 의미)

어떤 값(데이터)을 담는 저장소(메모리)의 이름 

보관함의 크기는 동일하며 데이터 이용

데이터 이름표

 

1-2 변수의 선언(declaration)&할당(assignment)

'변수를 선언한다.' 데이터 보관함에 데이터를 넣을 공간을 확보하는 것

'변수를 할당한다.' 선언에 = (대입assign)를 넣고자 하는 값을 넣기

변수의 선언과 할당은 반복적으로 사용해야 하는 값을 데이터 보관함에 저장하기 위해 사용한다.

변수는 상황에 따라 변할 수 있는 값, 이름(Label)이 붙은 것

※ 변수는 var, let, const 로 선언할 수 있다.

---

퀴즈

데이터 보관함의 크기는 각각 다르다 (x)

변수란 각 보관함에 붙인 이름을 의미한다. (O)

 

1-3 구구단 출력하기 

실습 1. 구구단 출력

let num = 9;

console.log(num * 1) // 9
console.log(num * 2) // 18
console.log(num * 3) // 27
console.log(num * 4) // 36
console.log(num * 5) // 45
console.log(num * 6) // 54
console.log(num * 7) // 63
console.log(num * 8) // 72
console.log(num * 9) // 81

 

 

Chapter2. 타입

학습 목표

• 원시 자료형 string, number, boolean, undefined의 의미를 이해할 수 있다.
• 타입마다 다른 속성과 메서드가 있다는 것을 이해할 수 있다.
• typeof 연산자를 활용하여 특정 값의 타입을 확인할 수 있다.
• 비교 시 엄밀한 비교( === 과 !== )의 필요성을 이해할 수 있다.

2-1 타입

숫자나 문자와 같이 변수에 할당할 수 있는 형태, 타입

number, string, Boolean,

undefined, 함수

타입이 섞인 경우

배열(순서가 있는 집합)  Compund(자료형)

객체

---

퀴즈

let int = '1024'일 때, 변수 int의 타입은 number이다. (X)

풀이 '  ', "   " 로 감싼 값의 타입은 string

1024가 number가 되기 위해서는 let int = 1024;

 

 

블로깅

Chenckpoing  typeof 연산자를 사용하여 값의 타입을 확인하는 방법

 

let number = 1;
console.log(typeof number)  // --- (1)

let string= '1';
console.log(typeof string)  // --- (2)

(1) number

(2) string

 

Chapter3. 함수

학습 목표

• 함수가 "작은 기능의 단위"라는 것을 이해할 수 있다.
• 함수 선언을 위해 필요한 keyword, name, parameter, body에 대해 이해할 수 있다.
• 함수의 호출과 리턴에 대해서 이해하고, 실제 코드로 작성하여 활용할 수 있다.
• 함수 그 자체(func)와, 함수의 호출(func())를 구분하여 사용할 수 있다.
• 매개변수(parameter)와 전달인자(argument)를 구분하여 사용할 수 있다.
• 같은 기능을 하는 함수를 선언식, 표현식, 화살표 함수로 바꾸어 표현할 수 있다.

3-1 함수

논리적인 일련의 작업을 하는 하나의 단위, 지시사항들의 묶음

- 코드의 묶음 (즐겨찾기 버튼)

- 기능(function)의 단위

- 입력과 출력간의 매핑 (mapping)

- 반드시 돌아온다 (return)

3-2 구구단 출력

 

3-3 함수 다루기

함수 선언 방법

함수 선언식
function getTriangleArea(base, height) {
     let triangArea = (base * height) / 2;
     return triangArea
}

함수 표현식
const getTriangleArea = function (base, height) {
      let triangArea  = (base * height) / 2;
      return triangArea
}

화살표 함수 
const getTriangleArea  =  (base, height) => {
     let triangArea  = base * height / 2;
     return triangArea
}

 

Chenckpoing  사각형의 넓이를 구하는 함수를 선언식으로 작성하고 함수 표현식/화살표 함수로 바꾸어 보세요.

 

함수 선언식

function getRectangleArea (width, height) {     
	let rectangleArea  = (width*height);     
	return rectangleArea
}

함수 표현식

let getRectangleArea = function (width, height) {     
	let rectangleArea = (width*height);     
	return rectangleArea
}

함수 화살표

let getRectangleArea  = (width, height) => {     
	let rectangleArea = width*height;     
	return rectangleArea
}

※ 내부의 코드가 1줄일 때, 중가로와 return 생략 가능!!let getRectangleArea = (width, height) => width*height;