Week 2
📢 변수가 필요한 이유와 선언하는 방법
변수(Variable)란?
변수란 값을 저장하기 의해 확보한 메모리 공간 자체 또는 메모리 공간을 식별하기 위한 식별자이다. 간단히 말해 '데이터를 저장하는 공간' 이다.
변수가 필요한 이유?
컴퓨터의 모든 데이터는 2진수로 저장하기 때문에 메모리에 저장되는 모든 데이터는 2진수로 저장된다.
하지만 이 연산된 결과값을 가져오기 위해서는 주소값이 필요한데, 코드가 실행될 때마다 주소값이 변경 된다. 그리하여 주소에 직접 접근하는 방법은 옳지 않다.
따라서 프로그래밍 언어는 이를 기억하기 위한 메커니즘으로 제공하는 것이 변수이다.
변수의 종류
자바스크립트에서 변수의 종류는 3가지가 있다.
스코프란?
어떤 변수들에 접근할 수있는지를 정의한다.
전역 스코프란 변수가 함수 바깥이나 {}바깥에서 선언되었다면, 전역 스코프로 정의된다.
지역 스코프(Block)란 중괄호로 감싸진 블록 내부에서만 사용이 가능하다.
함수 스코프(Function)란 특정 함수 내부에서만 사용이 가능하다.
호이스팅이란?
자바스크립트에서 아직 선언되지 않은 함수나 변수를 끌어올려서 사용할 수 있도록 하는 자바스크립트의 작동 특성을 말한다.
변수를 선언하는 방법
변수를 선언하는 방법은 아래와 같다.
var variable1 = 1;
let variable2 = 2;
const variable3 = 3;🖐 자바스크립트 데이터 타입의 종류
숫자(Number)
64비트 부동소수점 형식으로, 모든 숫자를 실수로 처리한다.
문자열(String)
15비트 유니코드 문자셋(UTF-16)으로 구성된 문자열
- 작은따옴표(''), 큰따옴표(""), 역따옴표(``)로 문자열을 할당할 수 있다.
- 특히, ES6부터 도입된 템플릿 리터럴을 이용하면, 줄바꿈이나 공백이 모두 적용된다.
불리언(boolean)
true 와 false로 이루어진 데이터 타입
미정의(undefined)
값이 할당되지 않았을 때, 자바스크립트 엔진이 암묵적으로 초기화하는 값
(타입도 값도 모두 undefined)
Null
의도적으로 '값이 없음'을 명시하기 위해 할당하는 값
- undefined는 값이 있어야하지만 정해지지 않은 것이고 Null은 값이 비워져있다는 뜻
🤟 Number 와 String의 메서드 각각 3개와 사용 방법
Number 메서드
Number.isInteger: boolean
매개변수에 전달된 값이 정수(Integer)인지 검사하여 그 결과를 Boolean으로 반환한다.
검사전 전에 인수를 숫자로 변화하지 않는다.
number.isInteger(123) // true
number.isInteger('123') // falseNumber.parseInt
매개변수에 전달된 문자열에 포함된 숫자 부분을 정수형태로 반환한다.
문자열로 시작하는 경우에는 NaN으로 반환
문자열이 여러개 존재하는 경우 첫번째 숫자만 반환한다.
Stirng 메서드
string.split
문자열 또는 정규표현식을 대상 문자열에서 검색하여 문자열을 구분한 후, 분리된 각 문자열로 이루어진 배열을 반환한다.
const str = 'How are you doing?';
// 공백으로 구분(단어로 구분)하여 배열로 반환한다
console.log(str.split(' ')); // [ 'How', 'are', 'you', 'doing?' ]
// 각 문자를 모두 분리한다
console.log(str.split('')); // [ 'H','o','w',' ','a','r','e',' ','y','o','u',' ','d','o','i','n','g','?' ]
// 정규 표현식
console.log(str.split(/\s/)); // [ 'How', 'are', 'you', 'doing?' ]
// 인수가 없는 경우, 대상 문자열 전체를 단일 요소로 하는 배열을 반환한다.
console.log(str.split()); // [ 'How are you doing?' ]
// 공백으로 구분하여 배열로 반환한다. 단 요소수는 3개까지만 허용한다
console.log(str.split(' ', 3)); // [ 'How', 'are', 'you' ]
// 'o'으로 구분하여 배열로 반환한다.
console.log(str.split('o')); // [ 'H', 'w are y', 'u d', 'ing?' ]String.slice
첫번쨰 인수로 전달한 start 인덱스에 해당하는 문자부터 두번째 인자에 전달된 End 인덱스에 해당하는 문자의 바로 이전 문자까지를 모두 반환한다.
String.substring과 기능이 같지만 음수를 사용 가능하다.
const str = 'hello world';
// 인수 < 0 또는 NaN인 경우 : 0으로 취급된다.
str.substring(-5); // 'hello world'
// 뒤에서 5자리를 잘라내어 반환한다.
str.slice(-5); // 'world'
// 2번째부터 마지막 문자까지 잘라내어 반환
tr.substring(2); // llo world
str.slice(2); // llo world
// 0번째부터 5번째 이전 문자까지 잘라내어 반환
str.substring(0, 5); // hello
str.slice(0, 5); // hello😀 함수가 필요한 이유
함수(Function)란 무엇인가?
함수란 특정 기능을 수행하도록 설계된 독립적인 코드 블록을 의미한다.
필요할 때마다 호출하여 해당작업을 반복해서 사용할 수 이싿.
함수가 필요한 이유
- 재사용성 : 같은 작업을 여러 곳에서 반복해야 할 때 함수로 만들어 필요할 떄 마다 호출하여 사용하면 편리하다.
- 가독성 : 함수의 이름만 보고도 어떤 기능을 수행하는지 유추할 수 있다.
- 모듈성 : 유지보수나 버그 발생 시 편리하다.
🛎 함수의 정의와 호출의 차이점
함수의 정의
함수의 정의는 function 키워드로 시작되며, 다음과 같은 구성요소를 가진다.
1. 함수의 이름
2. 골호 안에 쉼표(,)로 구분되는 함수의 매개변수(parameter)
3. 중괄호({})로 둘러싸인 자바스크립트 실행문
function 함수이름(매개변수1,매개변수2){
함수가 호출되었을 떄 실행하고자 하는 실행문;
}함수의 호출
정의된 함수는 프로그램 내에서 호출되어야 비로소 실행된다.
일반적인 함수의 호출은 함수의 정의문과 같은 형태로 호출할 수 있다.
// addNum이라는 함수를 정의
function addNum(x,y){
return x+y;
} // 함수 addNum을 호출하면서 매개변수에 3,5를 전달
console.log(addNum(3,5))정의와 호출의 차이점
함수의 정의는 말그대로 실행시킬 일련의 과정의 정의를 내려 함수의 존재를 선언하는 것 뿐이지
실행을 의미하는 것이 아니다.
그러므로 함수를 실행시키 위해서는 함수를 호출 시켜줘야한다.
🤔 조건문이 필요한 이유
조건문이란?
어떤 프로그래밍 언어든 코드는 의사 결정을 내리고 입력 내용에 따라 작업을 수행해야 한다.
간단하게 "만약에 ~라면 특정 코드를 실행해라"라는 것이 조건문이다.
조건문이 필요한 이유?
사람(과 동물)은 항상 그들의 삶에 영향을 미치는 결정을, 작은 것(과자를 하나 먹을까? 두개 먹을까?)부터 큰 것(고향에 머물면서 아버지의 농장에서 일해야 할까? 아니면 천체물리학을 공부하러 미국으로 유학을 갈까?)까지 내립니다.
조건문은 우리가, 반드시 내려져야 하는 선택에서부터 (예를 들자면, "쿠키 한 개 또는 두 개"), 그 선택들의 결과까지 (아마도 "쿠키 한 개를 먹는다" 의 결과는 "여전히 배가 고프다" 일지도 모르고, "쿠키 두 개를 먹는다" 의 결과는 "배부르다, 그러나 엄마가 쿠키를 다 먹었다고 나를 야단칠 것이다" 일지도 모릅니다), 그러한 의사 결정을 자바스크립트에서 표현할 수 있게 합니다.
🖥 boolean 타입의 조건문
boolean 이란?
불리언(boolean)은 논리학에서 참(true)과 거짓(false)을 나타내는데 사용된다.
또한, 논리 연산이란 주어진 논리식을 판단하여 참과 거짓을 결정한다.
조건문이란?
조건문은 어떠한 조건을 판별하는 기준을 만드는 것이다.
조건문에는 반드시 비교연산자가 필요하다,
비교의 결과는 늘 Boolean 즉, true 아니면 false이다.
비교연산자 종류
< > <= >= === !==
조건문에서 사용하지 않는 것
==, !=
위 연산자를 사용하지 않는 이유는 타입을 엄격하게 비교하지 않기 떄문이다.
// === 비교연산자를 사용한 경우
1 === 1 // true
1 === '1' // false
'true' === true // false
// == 비교연산자를 사용한 경우
1 == '1' // true
1 == true // true
null == undefined // true
[1] == true // trueboolean 타입의 조건문
if( 조건1 ) {
// 조건1이 통과(true)한 경우
} else if( 조건2 ) {
// 조건1이 통과하지 않고(조건1에서 false) 조건2가 통과(조건2에서 false)한 경우
} else {
// 모든 조건이 통과하지 않은 경우 (조건 1,2에서 false)
}