[JS/코테] 자바스크립트 기초 문법 정리

새로운 언어로 코테를 시작하며..

Python으로 코테 준비를 시작한 것은 잘한 선택이었다. 자료도 많고, 무엇보다 이해하기 쉬웠다. 알고리즘 자체를 공부하는 데 도움이 되었다. 그러나 프론트 직무를 준비하게 되면서, JS로 코테를 봐야 하고 또 유리할 수 있음을 알게 되었다.

그래서 최대한 JS로, 자료가 부족하다면 Python과 병행하여 공부해보려고 한다.

 

들어가기 앞서, VScode에서 Javascript를 실행하기 위해서는 1) node.js 설치 2) Code Runner 확장프로그램 설치 가 필요하다.

js 파일 실행 단축키는 Ctrl+Alt+N 이다.

---

세미콜론

자바스크립트에서는 라인마다 세미콜론(;)을 붙여줘도 되고, 안붙여줘도 인터프리터 과정에서 자동으로 구문 구분을 해야 하는 곳에 세미콜론을 삽입해준다(ASI). 그러나 예외 경우 오류가 발생할 수 있어서 기본 규칙은 세미콜론을 붙이는 것이다.

변수형

1. var : 변경 가능. 선언 단계와 초기화 단계가 한번에 이루어진다. 따라서 변수 선언문 이전에 변수를 참조해도 오류가 발생하지 않고, undefined를 반환한다.
2. let : 변경 가능. 선언 단계와 초기화 단계가 분리되어 진행. 변수 선언문 이전에 변수를 참조하면 ReferenceError 가 발생한다.
3. const : 변경 불가능. 상수나 객체 등 거의 재할당을 하지 않는 경우 기본적으로 사용한다. 

자료형

①숫자 ②문자열 ③불리언 ④심볼 ⑤undefined ⑥객체

배열 순회

a = [1, 3, 45, 2, 10]
a.forEach((e, i) => {	// e는 요소, i는 인덱스
    console.log(e, i)
})

간편한 배열 선언 방법

let arr = Array(50).fill(0)
// 이차원배열
let arr2 = Array(3).fill().map(e => Array(5).fill(0))

원소 스와프 (구조분해)

[arr[1], arr[3]] = [[arr[3], arr[1]]]

문자열 구분

const str = "Hello World!";
const ret = str.split(" ")
console.log(ret)	// ['Hello','World'] 반환

문자열 연결

const ret = ['Hello', 'World']
ret.join('')	// HelloWorld 반환
ret.join(' ')	// Hello World 반환
ret.join(' apple ')	// Hello apple World 반환

join 함수 외에도 +연산자, concat 함수 를 활용해 문자열을 연결할 수 있다.

정렬

let numbers = [3, 1, 4, 1, 5, 9, 2, 6, 5, 3, 5]
numbers = numbers.sort((a, b) => a - b)
// 내림차순
numbers = numbers.sort((a, b) => (a - b) - 1)

필터

const numbers = [3, 1, 4, 1, 5, 9, 2, 6, 5, 3, 5]
// 필터링
const ret = numbers.filter(e => e % 2 == 0)

map: 새로운 배열을 반환할 때 쓰는 함수.

const ret2 = numbers.map(e => e * 2)

reduce: 배열을 합치거나, 배열을 기반으로 값을 만들 때 쓰는 함수

const ret3 = numbers.reduce((total, e) => total + e, 0)

---

DFS

const graph = {
    1: [2, 3],      // 1의 자식 노드가 2, 3
    2: [4],
    3: [4, 5],
    4: [],
    5: []
};

const dfs = (here, visited = new Set()) => {
    if (visited.has(here)) return
    visited.add(here)
    graph[here].forEach(e => dfs(e, visited))
}

dfs(1);

이진탐색

정렬된 배열에 대해 빠르게 탐색하는 알고리즘

const a = [1, 2, 3, 4, 5, 6, 7, 8]
const bs = () => {
    let lo = 0
    let hi = a.length - 1

    const target = 3

    while (lo <= hi) {
        let mid = Meth.floor((lo + hi) / 2)
        if (a[mid] == target) {
            console.log(target)     // target을 찾았을 때
            return
        } else if (a[mid] > target) {
            hi = mid - 1
        } else {
            lo = mid + 1
        }
    }
    console.log(-1)   // target이 없을 때
    return -1
}
bs()

피보나치 수열

DP문제의 대표적인 예제

const fibo = (idx, memo = {}) => {
    if (idx <= 2) return 1
    if (idx in memo) return memo[idx]
    memo[idx] = fibo(idx - 1, memo) + fibo(idx - 2, memo)
    return
}
const retFibo = fibo(10)

 

 

이외에도 

find

findIndex

includes

substring

slice

Object.keys

Object.values

Object.entries

Math.round

Math.ceil

Math.floor

Math.abs

를 외워두자 !

---

출처: 

https://velog.io/@bathingape/JavaScript-var-let-const-%EC%B0%A8%EC%9D%B4%EC%A0%90

var, let, const 차이점

 

https://tcpschool.com/javascript/js_datatype_basic

코딩교육 티씨피스쿨

 

https://www.youtube.com/watch?v=MlvZ2IufTFI