js | 기초 개념 정리

변수 (타입)

• Array(배열)
  • 형태 : ['하나', '둘', '셋'], [100, 200, 300],
  • 호출 : 변수명, 변수명[0], 변수명[0][0] -> (2차원 배열)
    (변수명[index])
    [ _ ] 는 인덱스라고 하며, 호출하면 indexing되었다고 한다.
• String(문자열)
  • 형태 : 'abcde', "abcde", (백틱)abcde(백틱)
  • 호출 : 변수명, 변수명[0] (변수명[index])
• Number(숫자)
  • 형태 : 10, 10.123
  • 호출 : 변수명
• Boolean(논리값)
  • 형태 : true, false
  • 호출 : 변수명
• Object(객체)
  • 형태 : {
    "지역이름": "전국",
    "확진자수": 24889,
    "격리해제수": 23030,
    "사망자수": 438,
    "십만명당발생율": 48.0
    }
  • 호출 : 변수명, 변수명.지역이름, 변수명['지역이름'] (변수명.key, 변수명[key])
• undefine : undefind
• null : object
• NaN : number

typeof null == "object" 는 언어 자체의 오류
typeof function(){} == "function" 는 함수는 특별하게 취급됩니다.

• 산술연산(+, -, / , * , ** , %)
• 논리연산(!, &&, ||)
• 비교연산(==, !=, >, >=, <, <=, ===, !==)
• 조건문(if, else if, else, switch)
• 반복문(for, for in, for of, while, do while, forEach, break, continue)

//for 문
for (let i = 0; i < 10; i++) 
    console.log(i)
}

//for of 문
let a = [10, 20, 30, 40];
for (let i of a) {
    console.log(i);
}

//for in 문
let a = [10, 20, 30, 40];
for (let i in a) {
    console.log(i);
}
// while 문
let x = 0;
while (x < 10) {
    console.log(x);
    x++;
}

// do while 문 
let x = 0;
do {
    console.log(x);
    x++;
} while (x < 10)

// forEach 문
let a = [10, 20, 30, 40];
a.forEach(e => console.log(e2));

// break 문
for (let i = 0; i < 10; i++) {
    if (i == 5) {
        break;
    }
}
// break 와 continue 문 
for (let i = 0; i < 10; i++) {
    if (i == 5) break;
    console.log(i);
}

for (let i = 0; i < 10; i++) {
    if (i == 5) break;
    console.log(i);
}

for (let i = 0; i < 10; i++) {
    if (i == 5) continue;
    console.log(i);
}

함수

• 함수
  // 여기서 x, y를 보통 한국에서는 인자라고 한다.
  // 전달인자(아규먼트, argument) : 3, 5
  // 매개변수(파라미터, parameter) : x, y

function add(x, y){
    return x + y;
}

add(3, 5)

• 콜백함수

function add(x, y) {
    return x + y;
}

function mul(x, y) {
    return x * y;
}

function cal(a, b){
    return a(10, 10) + b(10, 10);
}

cal(add, mul);

• 화살표함수

function add(x, y) {
    return x + y
}

let addArrow = (x, y) => x + y;

• 익명함수 아님

// 기명 함수
let aa = function sum(x, y) {
    return x + y
}

// 익명 함수인것 같지만 바뀜
let bb = function(x, y) {
    return x + y
}

// ES5에서는 빈 문자열이었는데 ES6에서 name 값을 가지는 것으로 바뀌었다.

let cc = (x, y) => x + y;

=> 은 익명함수이다.

익명함수는 함수를 변수에 저장하는 함수인데, 이름이 없다고 생각하시기 보다 함수명 대신 변수명을 사용하여 호출한다고 생각하면 된다. 익명함수는 이름이 없는 함수이지만 위에 예제에서는 변수명을 사용해서 이름이 있는 것이다. console.dir에서 나온 name 은 변수명을 호출한 것.

함수가 할당된 변수는 name 속성을 가지게된다. 다른 변수에 할당되더라도 그 name 속성의 값은 변하지 않는다. 함수의 이름이 생략되었다면, name 속성의 값은 그 변수의 이름이 될 것이다. 화살표 함수에도 적용된다. 화살표 함수는 이름을 가지지 않으므로 해당 변수에 암묵적인 이름만 줄 수 있다.

변수 선언

let x : 변수로 사용하세요.
var x: (전역에서 사용할 변수값, 실무에서 되도록 사용 X)
const x : (변하지 않는 상수값), 실무에서 베이스로 사용

전개표현식 사용

function add(...x){
    return x;
}

add(1, 2, 3, 4, 5)

어떤 값들을 한번에 받을때나 펼쳐보일때 사용한다.

블록 스코프

hojun이 not defined 되었다고 나옵니다.
함수레벨스코프(var)와 블록레벨스코프(let, const)의 차이

if (true){
    let hojun = 100;
}

console.log(hojun);

정규표현식

prompt('hello?')
'hi'
comfirm()
VM188:1 Uncaught ReferenceError: comfirm is not defined
    at <anonymous>:1:1
(익명) @ VM188:1
confirm('hi')
true
alert('hello')
undefined