>westudy | Week 2 - JavaScript

 

## 자바스크립트 영상 시청

01_Console.log

`console.log(출력할 대상)` : console에 찍어볼 때 사용한다.

02-1_Variables1 - 변수 선언과 할당

- 변수란 ? : 데이터를 담을 수 있는 대상

 1) 변수의 선언(declare) :  `let myNumber`

 2) 변수의 할당, 대입(assign) : `myNumber = 100;`

- 변수의 선언과 할당을 동시에 할 수도 있다.  : `let myNumber = 100;`

02-2_Variable2 - data types

- 기본타입(primitive type)

  1) number : 숫자, 연산 가능( +, -, *, /, 나머지(remainder) % )

  2) string : 문자열, 따옴표안에 작성

  3) boolean : 참(true, 1)과 거짓(false, 0)

  4) undefined : 변수를 선언했지만 대입이 이뤄지지 않은 경우 undefined가 자동으로 할당된다.

  5) null : 사용자가 빈 값을 value로 할당을 한 경우

let a;
let b = null;

console.log(a == b);  // true
console.log(a === b); // false

- 엄격일치연산(===)은 type까지 같아야 true를 return한다.

- typeof를 사용하면 type을 알 수 있다.

- 참조타입(reference type)

  1) object : { key : value }

  2) array : [ 요소1, 요소2 ]

  3) function : function 함수이름() {}

03_String

- 문자열 합치기 : + 사용

  `console.log( "2" + 2 )`  

  문자열 + 숫자는 문자열로 계산되기 때문에 문자열 “22”가 출력된다.

- 문자열 길이 구하기 

  `변수.length`

  `‘문자열’.length`

 console.log("The length of pepsi is ”, ‘pepsi’.length)   // 숫자 5 출력
 console.log("The length of pepsi is ” + ‘pepsi’.length)  // 문자 5 출력

// 문자열과 숫자의 덧셈은 문자열이 된다!!

04-1_Function1 - 함수 정의와 호출

1) 함수의 구성 요소 : input / 기능 수행 / output

2) 함수는 정의(선언)하고 나서 호출(실행)을 해야 기능 수행을 한다.

3) input 또는 output 없이 함수를 선언할 수 있고, input과 output 둘 다 없을 수도 있다.

function sayHello() {     // 함수 선언
	console.log('안녕하세요')   // 함수 기능 수행
}
 
sayHello()  // 함수 실행

04-2_Function2 - return이 있는 함수

1) return은 함수의 output을 반환하기 때문에 결과물이 있다. 따라서 변수에 할당이 가능하다.

2) console.log는 단순히 화면에 출력만 하기 때문에 변수에 할당이 불가능하다.

function outputFunction() {
	return 300
}

let functionNumber = outputFunction()
console.log(functionNumber)  // 300 출력

let consoleNumber = console.log(300)
console.log(consoleNumber)  // undefined 출력

04-3_Function3 - input이 있는 함수

function addTwoNumbers(num1, num2) {     // num1, num2는 parameter
	let result = num1 + num2
	return result
}

let addedNumber = addTwoNumbers(7, 3)   // 7, 3은 argument
console.log(addedNumber)   

- 함수를 선언할 때 비어있던 소괄호 안은 input의 자리다. 함수를 선언할 때 input은 parameter라고 부르고, 함수를 실행할 때 쓰는 input은 argument라고 부른다.

- 함수 내부에서 사용하는 변수나 파라미터는 중괄호 기준으로 내부에서 접근이 불가능하다.

06-1_조건문1 - 조건문과 Boolean

if (조건문) {
	실행할 코드
} else if (조건문) {
	실행할 코드
} else if (조건문) {
	실행할 코드
}
.
.
} else {
	실행할 코드
}

06-2_조건문2 - 비교연산자

동등 (==) 서로 같으면 true를 반환

부등 (!=)	서로 다르면 true를 반환
일치 (===)	값과 타입이 모두 같으면 true를 반환
불일치 (!==)	값 또는 타입이 다르면 true를 반환
큼 (>)	왼쪽이 오른쪽보다 크면 true를 반환
크거나 같음(>=)	왼쪽이 오른쪽보다 크거나 같으면 true를 반환
작음 (<)	왼쪽이 오른쪽보다 작으면 true를 반환
작거나 같음 (<=)	왼쪽이 오른쪽보다 작거나 같으면 true를 반환

06-3_조건문3 - 논리연산자

논리 AND (&&)	둘 다 참일 때 true를, 그 외에는 false를 반환
논리 OR (||)	둘 중 하나가 참일 때 true를, 그 외에는 false를 반환

- truthy & falsy : 참 같은 값이 if 옆에 작성되면 if블록을 실행한다.

- falsy : false, 0, -0, “”, null, undefined, NaN

 

728x90

## 변수에 대하여

01_변수?

- 데이터 값을 저장하는 데 사용한다.

 

02_변수가 필요한 이유?

-> 한번 선언하면 여러 곳에서 가져다 사용할 수 있고(재사용성), 값을 변경해야 하는 경우 변수에 담긴 데이터 하나의 값만 수정하면 되기 때문에 유지 보수에 편하다.

 

03_변수를 선언하는 방법?

-> 변수를 선언(할당)하고, 대입을 통해 선언한다. 아래의 코드는 할당과 대입을 동시에 진행했다. 변수를 선언만 하고 할당하지 않으면 초기값으로 undefined가 설정된다.

let myName = '랖니';

 

04_변수 선언 방식의 차이?

1) let

-> 1. 선언 2. 초기화 3. 할당

-> 변수의 값이 변할 것 같으면 let를 사용한다.

-> block-scoped ( 그게 뭐야? - 코드 블록 내에서 선언된 변수는 블록 안에서만 유효하다. 함수/if문/for문/while문 등)

2) const

-> 1. 선언+초기화+할당

const gender;
gender = 'female';     // Uncaught SyntaxError가 발생한다.

-> 일반적인 사용 시 const를 사용(read-only로 값 수정이 불가하다.)

-> block-scoped

3) var

-> 1. 선언 및 초기화 단계 2. 할당 단계

-> 한번 선언된 변수를 다시 선언할 수 있다.

-> 선언하기 전에 사용이 가능하다.

⇒ 호이스팅이 일어나기 때문이다(최상위에 변수가 선언된 것처럼 코드 영향력이 위로 올라감)

⇒ 선언 및 초기화 단계가 동시에 이뤄지기 때문에 var name;은 호이스팅 O

⇒ 할당되는 부분인 name=”은형”은 호이스팅이 되지 X.

⇒ 그렇기 때문에 에러가 발생하지 않고 undefined 리턴

console.log(name);
var name = '랖니';      // 에러가 발생하지 않고 undefined.

-> 함수 scoped (그게 뭐야? - var은 다 접근 가능하지만 유일하게 함수에서만 갇힌다.)

 

## 자바스크립트 데이터 타입의 종류는?

1. string : 따옴표로 감싸며 문자열이다.
2. number : 숫자형이고 연산이 가능하다.(나머지-remainder는 %로 연산 가능)
3. boolean : 참(true, 1)과 거짓(false, 0)
4. undefined : 변수의 선언 이후 값을 할당하지 않은 경우
5. null : 사용자가 빈 값을 대입하는 경우
6. object : { 키 : 값 }
7. array : [요소1, 요소2, 요소3]
8. function : function 함수이름(parameter) {}