JS를 정리하기전 여러 분들의 강의를 들어보았지만 개인적으로 제로초님 유투브에 업로드 된 JS강의가 저에게 맞는 것 같아 그 분의 강의를 틀로 잡고 다른 분들의 지식을 더하여 정리를 해보았습니다.

Java Script

웹페이지에 생동감을 불어넣기 위해 만들어진 프로그래밍 언어이다.

JS는 코드를 한 줄씩 읽는다는 특징이 있고, JS의 중요한 부분인 console은 실시간으로 자바스크립트를 실행하고, 에러 메시지등을 출력해주는 기능을 하는데 Node.js의 REPL와 실행하는 방법이 비슷하다.<R(Read) 읽고 E(Eval) 입력 값을 평가하고 P(Print) 그 결과 값을 출력하고 L(Loop) 그 후 프롬포트가 나타나 새로운 입력을 기다린다.>

프로그래밍을 하기에 앞서

1. 첫 번째로 중요한 것은 프로그래밍 사고력 기르기이다.
   그 방법은 정확한 명령을 내려야하고, 본인이 하려는 코딩의 순서도를 많이 그려서 컴퓨터가 어떻게 작동되는지 알아야한다.
2. 두 번째로 중요한 것은 코드 작석 규칙을 알아야한다.
   오타, 띄워쓰기, 소·대문자 바꿔쓰기 등 이런 모든 것들은 에러가 나기 때문에 주의 하거나 실수를 바로 잡아주는 좋은 에디터를 사용한다.
   그리고 명령 뒤에는 ;(세미콜론)을 붙여 명령의 끝임을 인지해주게 하고, 안붙여서 에러나는 현상을 줄일 수 있다.

연산자

프로그래밍에서 쓰이는 기호들, 연산자 우선수위는 따라 결과 값이 달라지기 때문에 외워놓는게 좋다.

연산자 우선순위

1. () <만능키 같은 역할>
2. 증감 연산자 --, ++
3. 산술 연산자 *, /, %, +, -
4. 비교 연산자 >, >=, <, <=, ==, ===, !==, !=
5. 논리 연산자 &&, ||, !
6. 대입(복합 대입) 연산자 =, +=, -=, *=, /=, %=

증감 연산자

변수에 1을 더해주거나 빼주는것 붙는 자리에 따라 사용법이 달라지는데 앞에 붙으면 전위증감연산자, 뒤에 붙으면 후위증감연산자라고 부른다.

산술 연산자

+, -, *(곱하기), /(나누기), %(나머지), **(제곱) 등이 있다.
ex) 2의 3 제곱은 2**3 // 8이 나온다.

형변환 (type casting)

문자 + 숫자하면 문자열로 바뀌는 것처럼 JS가 자동적으로 변환시켜주는 것을 형변환이라고 한다.
여기에는 규칙들이 있다.
1. +일 때는 문자열이 아닌 것들이 문자열로 바뀜
2. 나머지 상황에서는 숫자가 아닌 것들이 숫자로 바뀜

'4월' - 0 // NaN
'11월' * '19일' // NaN 
'3' - 0 // 3

예시를 봤을 때 문자열을 함수Number()로 바꿔 사용하는 공식이 이용된다라는 것을 알 수 있다.
그리고 너무 헷갈린다면 자료형을 동일하게 만들고 계산해주면 된다.

비교 연산자

>, < , >=, <=, ==, ===, !=, !== 등이 있다.

3 > 5 // false
5 > 3 // true
5 != 5 // false

5와 5는 같은데 !=를 써서 아니라고 하니 false값이 나온다.

==와 ===의 차이점

==은 자료형까지 비교하지 않고 형변환을 하여 같다고(true) 함.
===은 자료형 종류까지 비교하여 비슷한 뜻으로 쓰인다고 하더라도 종류가 다르기 때문에 다르다고(false) 함.

'1' == 1 // true
1 == true // true
1 != '1' // false

형변환이 되어 다 true인데 !=을 써서 다르다고 하니 false값으로 나옴

'1' === 1 // false
1 === true // false
1 !== '1' // true

형변환이 안되어 종류가 같지 않아 다 false인데 !==을 써서 같다고 하니 true값으로 나옴

비교 연산자로 알 수 있는 점

• 유일하게 같은 값인 것 같은데 아닌것

NaN == NaN // false
NaN >= NaN // false
NaN <= NaN // false
NaN < NaN // false
NaN > NaN // false
NaN != NaN // true

NaN은 !=(같지 않다) 빼고는 다 결과 값이 false로 만약 x라는 값이 모르는 값인데 x == x했을 때 false가 나오면 x는 NaN이 된다.

• true와 false의 크기

true > flase // true

true는 숫자 1과 비슷한 개념이고 false는 0과 비슷한 개념이기 때문에 true가 false보다 더 크다.

• 문자열 비교 가능
  사전 순이고 숫자의 크기를 모른다 하더라도 .charCodeAt ()을 사용하여 꼭 문자가 뿐만 아니라 특수문자의 정해진 숫자를 알 수 있다

'b' > 'a' // true
'ad' > 'ab' // true
'cf' > 'mo' // false

• 문자열과 숫자 비교 가능
  문자열이 숫자로 바뀌면서 비교 가능해짐

'3' < 5 // true
'abc' < 5 // false

문자열 '3'은 숫자 3으로 바뀌면서 숫자 5와 비교하고 abc는 숫자가 아니라 NaN로 바뀌면서 NaN는 != 빼고는 결과 값이 false라 위와 같이 나옴

논리 연산자

&&, ||, !등이 있다.
&&은 비교하는 모두 다 true여야 true가 되고 그렇지 않으면 false이다.
||은 비교하는 모두 다 false여야 false가 되고 그렇지 않으면 true이다.
!는 반대라는 뜻으로 !!처럼 두번을 하게되면 그 값이 ture인지 false인지 알려준다.

falsy value (형변환 했을 때 false인 값)

!!을 사용하여 형변환했을 때의 값을 알 수 있다.

• !!false
• !!''
• !!0
• !!NaN
• !!undefined
• !!null
  위의 모든 값은 false이고, 반대의 말은 truthy value라 하고 위 6개가 아닌 나머지가 해당된다.

!(2 < 0) // true
!2 < 0 // false

첫 번째는 ()안의 값은 false인데 !가 있으니 반대 의미가 되어 true로 된다.
두 번째는 !2는 0인데 0 < 0은 false가 되어 그 값이 된다.