출처 : https://www.youtube.com/watch?v=ZOVG7_41kJE&t=3722s
- 세팅하기
영상을 보고 node.js는 따로 다운 받지 않아도 되고
vscode에서 extension에서 code runner와 Live server만 다운로드 한 후
console.log('Hello World');오류 발생...
zsh: command not found : node
엄청난 구글링을 통해 node.js 설치가 안 되어서 생긴 오류라는 것을 알았다.
터미널에서 Node.js 설치 확인
node -vcommand not found: node 오류 확인됨 -> Node.js가 설치 되지 않은 것
Node.js설치 (Homebrew 사용)
brew install node(엄청나게 많은 문장들이 출력되면서 설치..)
vscode를 재시작 하니 정상적으로 Hello World 출력..!
- 주석(comment) 작성
C++을 먼저 공부한 나로서는 주석 다는 법은 동일 했다.
// 코멘트 작성 방법 첫번째
개신기하다고 생각한건 코멘트 작성 두번째 방법이었다..
/**을 입력하면 자동적으로
/** */ 처럼 뒤에 별슬래시가 생성되고
/** 여기 가운데에서 엔터를 누르면
* 이런식으로 자동으로 중간에도 *이 생긴다.
* 주석을 길게 달 수 있다.
*/
- Variable 선언
1) var - 이제는 더이상 잘 쓰지 않는다.
2) let
-> let과 var로 변수 선언하면 추후에 값 변경 가능
var name = '스누피';
console.log(name);
name = '찰리';
console.log(name);
let age = 20;
console.log(age);
age = 33;
console.log(age);출력 :
스누피
찰리 -> 바뀐 변수 값으로 출력
20
33 -> 바뀐 변수 값으로 출력
3) const
-> const으로 변수 선언하면 선언한 변수의 값을 바꿀 수 없다.
const job = '대학생';
console.log(job);
job = '개발자';
console.log(job);출력 :
대학생
오류발생
선언과 할당
1) 변수를 선언하는 것
2) 할당
var area = '서울';
console.log(area);var을 이용하여 변수 area를 선언하고
area에 서울이라는 값을 할당한 것
let food;
console.log(food);출력 :
undefinded
let을 이용하여 변수 food를 선언했지만 값을 할당하지 않았기 때문에 undefined 출력
* 할당 하지 않은 변수의 초기값은 undefined
+ const은 변수의 값을 수정할 수 없으므로 무조건 변수 선언을 할 때 값을 할당 해야한다.
- Naming Conventions 1
1) 일반적으로 영어(라틴문자)를 사용하면 문자와 숫자를 모두 사용할 수 있다.
2) 특수기호는 언더스코어와 달러를 사용할 수 있다
ex) _girl, $boy
3) 숫자로 이름을 시작할 수 없다
ex) 1Name, 2Hello
4) 키워드는 변수명으로 사용할 수 없다.
ex) var const = 'var';
- Naming Conventions 2 -> 개발자들의 암묵적인 약속?과 비슷
1) camelCase -> 대부분의 언어에서 많이 사용
2) snake_case -> 파이썬같은 언어에서 사용
3) PascalCase -> C# 마이크로소프트 계열의 언어에서 사용
- Data Types
여섯개의 Primitive Type / 한개의 오브젝트 타입
1) Number(숫자) 타입
const height = 160;
console.log(typeof height);출력 : number
2) String(문자열) 타입
const bird = '참새';
console.log(typeof bird);
출력 : string
+ Template Literal
1. newline -> \n
2. tab -> \t
3. 백슬래시를 스트링으로 표현하고 싶다면 두번 입력
const backSlash = '스누피\\찰리';
console.log(backSlash);출력 : 스누피\찰리
++ 출력값에 따옴표를 포함하고 싶다면
const smallQutoation = '스누피\'찰리';
console.log(smallQutoation);출력 : 스누피'찰리
++ `` 이용 (이게 제일 간편함)
const flower = `안개
꽃`;
console.log(flower);
console.log(typeof flower);
const groupName = '마마무';
console.log(groupName + ' 문별');
console.log(`${groupName} 문별`);출력 :
안개
꽃 -> `` 이용하면 엔터 쳐도 그대로 출력
string
마마무 문별
마마무 문별
3) Boolean(불리언) 타입
const isTrue = true;
const isFalse = false;
console.log(typeof isTrue);
console.log(typeof isFalse);출력 :
boolean
boolean
4) undefined(언디파인드) 타입
-> 사용자가 직접 값을 초기화하지 않았을 때 지정되는 값
* 직접 undefined로 값을 초기화하는건 지양해야함 = 개또라이미친넘
let noInit;
console.log(noInit);
console.log(typeof noInit);출력 :
undefined
undefined
5) null(널) 타입
-> undefined와 마찬가지로 값이 없다는 뜻이나 JS에서는 개발자가 명시적으로 없는 값으로 초기화할 때 사용
let init = null;
console.log(init);
console.log(typeof init);출력 :
null
object -> 이렇게 나오는게 버그인데 이미 object로 받아들인 사람들이 많아서 수정하지 않음
6) Symbol(심볼) 타입
-> 유일무이한 값을 생성할 때 사용 / 다른 프리미티브 값들과 다르게 Symbol함수를 호출해서 사용됨
const test1 = '1';
const test2 = '1';
console.log(test1 === test2);
const symbol1 = Symbol('1');
const symbol2 = Symbol('1');
console.log(symbol1 === symbol2);출력 :
true
false -> 같아 보이지만 유일무이한 값이기 때문에 false 출력됨
7) Object(객체) 타입
-> Map타입과 굉장히 비슷 / key:value의 쌍으로 이루어져 있음
const dictionary = {
red :'빨간색',
orange : '주황색',
yellow : '노란색',
};
console.log(dictionary);
console.log(dictionary['red']);
console.log(typeof dictionary);출력 :
{ red : '빨간색', orange : '주황색', yellow : '노란색' }
빨간색
object
7-1) Array 타입
-> 값을 리스트로 나열할 수 있는 타입
+ index -> 0부터 시작해서 1씩 증가
const colorArray = [
'검은색',
'보라색',
'하얀색',
'핑크색',
];
console.log(colorArray);
console.log(colorArray[0]);
colorArray[1] = '파란색';
console.log(colorArray);
console.log(typeof colorArray);출력 :
[ '검은색', '보라색', '하얀색', '핑크색' ]
검은색
[ '검은색', '파란색', '하얀색', '핑크색' ] -> index를 이용하여 값 수정 가능
object
/**
* static typing -> 변수를 선언할 때 어떤 타입의 변수를 선언할 지 명시를 한다
* C
* dynamic typing -> 변수의 타입을 명시적으로 선언하지 않고 값에 의해 타입을 "추론"
* JS -> dynamic typing
*/
- Hoisting
-> 모든 변수 선언문이 코드의 최상단으로 이동되는 것처럼 느껴지는 현상
< 1 >
console.log(name);
var name = '스누피';
console.log(name);출력 :
undefined
스누피
< 2 >
var name;
console.log(name);
name = '스누피';
console.log(name);< 1 > 코드는 < 2 > 코드처럼 작동함
= Hoisting
* var뿐만 아니라 let과 const에서도 Hoisting이 발생함
console.log(dog);
let dog = 'yuki';출력 :
Cannot access 'dog' before initialization (오류)
= dog라는 변수가 존재는 함 (undefined로 배정 되어 있음) 그치만 let으로 선언했기 때문에
실제 dog라는 변수에 값을 할당하는 순간이 오기 전에 접근할 수 없게 되는 것
(let 키워드 말고 const 키워드를 사용해도 동일하게 출력됨)
* var키워드는 hoisting 현상을 막아주지 못하지만
let과 const 선언하고 그 값이 초기화 되기 전에 값을 미리 가져오는 버그를 방지할 수 있음
=> var 키워드를 더이상 잘 쓰지 않는 이유