KDT 웹개발자 입문 수업 11일차 - 2

자바스크립트

 

1. console.log()

console.log() 는 개발자 도구의 console부분에 문구를 적을 수 있는 함수

 

2. alert()

경고창을 띄울 수 있는 함수, 확인을 누르기 전까지 홈페이지의 갱신이 되지 않는다

 

3. confirm()

확인/취소를 선택할 수 있는 함수, 확인의 경우 true/취소의 경우 false값을 리턴하여 if문과 같이 사용하기 좋음

 

4. CamelCase : personObj (변수명)

PascalCase : PersonObj (생성자,함수명등에)

 

5. 인덱스는 0부터 시작

 

6. 변수 : 데이터를 저장하고 참조하는 데이터의 이름

var, let, const

let : 값의 재할당이 가능

const : 값의 재할당이 불가

 

7. 예약어 : 특별한 의미가 있어 변수나 함수이름 등으로 사용할 수 없는 단어

 

8. 데이터의 종류(자료형)

8-1. String

" ", ' ' 를 사용하거나 ` ` 을 사용하면 ${ }으로 변수를 사용해줄수도 있다.

 

8-2. Number

정수 및 부동 소수점(실수)를 나타내줄 수 있다.

 

8-3. Boolean

true/ false

 

8-4. undefined 

값이 할당되지 않은 상태를 표기

예기치 못한 상황에 값이 주어지지 않은 경우에 사용하는 것이 올바름/직접 지정하는 것은 옳지 않음

 

8-5. Null 

의도된(일부러) 빈 데이터

 

8-6. Array

arr = [ 1, "str", null, true ];

 

8-7. Object 객체형 데이터

여러 데이터를 key:value의 형태로 저장

let obj = { name:"길동", age: 10, };

 

9. 자료형을 알려주는 typeof

typeof null 은 object 가 리턴된다. (오류)

 

 

10. 문자와 변수를 동시에 쓰고자할 때

 

10-1. 메서드의 매개변수로 넣기(,가 구분자)

console.log("문자열", 변수, "문자열");

,로 연결해준 값은 공백이 되어 문자열로 출력

 

10-2. + 연산자를 사용 (지양)

console.log("문자열" + 변수 + "문자열");

+로 연결해준 값이 공백 없이 문자열로 출력

 

10-3. 백틱(` `) 문자 + ${ }

console.log(`문자열 ${변수} 문자열`);

백틱 안에 써준 내용이 그대로 출력

 

 

11. prompt 로 입력 받은 값은 문자로 저장이 된다!

-> JS의 자동 형변환은 Error가 뜨지 않았다면 의도하지 않은 중대한 문제를 일으킬 수 있다.

 

11-1. 자동적 형변환

자바스크립트의 자동 형변환..

string 임에도 자동형변환이 되어 number로 변하여 연산된다. 이런 경우는 예측 불가하므로 지양해야 한다.

11-2. 명시적 형변환

자동 형변환에 의존하지 않고 직접 형변환을 시키는 것

String() : String 타입으로 변환

Number() : Number 타입으로 변환

다만 매개변수로 숫자로 바꿔줄 수 없는 값을 넣어주면 NaN가 리턴된다. (ex. console.log(Number("abc")); )

+연산자에 의해 문자열이 합쳐진 결과

Boolean(): Bool 타입으로 변환

 

12. var 를 지양해야하는 이유

var name = "이름1";
var name = "이름2";
// 에러 없음

let name = "이름1";
let name = "이름2";
// 에러 발생

중간의 같은 이름의 변수를 다시 선언해도 기존의 변수에 덮어 씌워진다.

변수의 선언이란건 분명 다른 데이터를 넣으려는 것인데 그것을 기존 데이터에 덮어씌우면 문제가 생겨버린다.

 

블록 단위에서 끝나는 것이 아닌 전역을 돌아다니므로 의도치 않은 문제가 발생한다.

 

var 사용을 지양하고 let을 권장한다!