-

◎ 중첩함수 : 함수 내부에 만들어지는 함수 - 지역변수처럼 함수 내부에서만 사용이 가능 - 일반적으로 이름이 없는 이벤트 리스너로 많이 화룡ㅇ - 중복코드 또는 그룹화 (함수 내부의 큰 기능이나 중복코드를 내부함수로 만들어 재사용시 사용) * 중첨함수의 변수 scope - 중첩함수는 외부함수의 변수 접근이 용이함 let a = 100, b = 200, c = 300; function outer() { let b = 2000, a = 22, c = 100; function inner() { let c = 20000 console.log(`a : ${a}, b : ${b}, c: ${c}`); } inner(); // 외부에서 호출이 불가하므로 중첩함수를 호출해놓음 } outer(); //a : 22, b..

화살표 함수 ES6(ES2015)부터 추가된 자바스크립트 함수 표현식의 간결한 문법function 키워드 대신 => 기호를 사용하여 짧고 직관적으로 함수 작성 가능this 바인딩 주의new 연산자로 인스턴스 생성 불가, new 생성자와 함께 호출할 수 없음특징1. this 바인딩이 없음 → 상위 스코프의 this를 사용함기본 함수와 차이function은 호출 방식에 따라 this가 달라짐 (동적 바인딩)화살표 함수는 this를 자기 내부에서 새로 만들지 않고, "바깥쪽 함수" 또는 "바깥 스코프"의 this를 그대로 사용언제 유용? 콜백 안에서 this 유지할 때!화살표 함수의 this 특징화살표 함수는 this를 만들지 않는다.→ 자기 안에서 새로 바인딩하지 않음this는 바깥(선언된 위치)의 this..

변수 - 값 변경 가능 - 기본 변수 선언방법 - let (added in ES6) - 현재 IE11에 부분적 호환varblock scope를 무시한 호이스팅 발생함수 스코프에 종속되어 함수 내에 선언한 경우 함수 밖에서 사용 Xfor문의 경우 for문도 밖에서 사용 가능let블록 스코프로 종속됨const재할당을 통해 값이 변경되거나 재 선언할 수 없음객체를 const로 할당하는 경우 속성 재할당 가능 (Object.freeze(객체명)을 통해 고정도 가능)TDZ(Temporal Dead Zone)변수의 일시적 비활성 구역var는 정의되기 전 접근 가능하여 undefined값을 갖지만, 값에는 접근할 수 없음let은 변수가 선언되기 전까지 TDZ에 머물러 초기화 전 변수에 접근 시 오류 발생let,..

함수특정 작업을 수행하는 코드의 집합반복되는 코드를 하나로 묶어서 이름을 붙인 것장점반복되는 코드를 한 번만 정의하여 재사용 가능기능별로 나누어 함수를 작성할 경우 모듈화로 코드의 가독성을 높일 수 있음기능별로 수정이 가능하므로, 유지보수가 용이 함수의 기본 구조function sayHello() { console.log("안녕!");}function: 함수 선언 키워드sayHello: 함수 이름 (작명 가능)(): 매개변수(parameter)를 받을 자리{}: 함수 본문, 여기에 동작을 작성함수 호출선언만 하면 실행되지 않음함수 이름 뒤에 ()를 붙이면 실행 매개변수(Parameter), 인자(Argument) 매개변수 (parameter) : 함수를 선언할 때 사용하는 변수로, 함수가 어떤 값을 ..

매개변수 (Parameter)함수를 선언할 때 사용하는 변수로, 함수가 어떤 값을 받을 수 있는지 정의하는 부분✓ 함수를 선언할 때 옆에 붙어서 받을 준비(prepare)만 하는 변수function add(x, y) { // x, y: 매개변수(parameter) = 받을 준비만 함 return x + y;}인자 (Argument)함수를 호출할 때 실제로 전달되는 값으로, 파라미터가 정의된 변수에 전달되는 실제 값add(3, 5); // 3, 5: 인자(argument) = 실제로 넣은 값 매개변수 활용인수를 객체 형태로 만들어 호출 시 순서에 상관없이 해당 값 변경 가능 // tip 값 변경하는 함수function calc(total, tax=0.1, tip= 0.01){..

• 기본 매개변수 - 항상 같은 매개변수를 반복하는 경우 기본값을 지정하여 기본 매개변수를 사용 - 매개변수는 왼쪽부터 처리하므로 기본값을 사용하는 경우 후순위로 매개변수 나열 * 기본 문법 함수명(매개변수, 매개변수=기본값, 매개변수=기본값) {} function func(b, a = 1) { console.log(b, a); } func(5); // 5, 1 • 나머지 매개변수 : 매개변수의 개수가 가변일 경우 사용하는 문법 - 마침표 3개를 입력 - 매개변수들이 배열로 들어옴 * 기본 문법function 함수(...나머지 매개변수) {}function sample(...item) { return item } console.log(sample(1, 2,3)) // [ 1, 2, 3 ] • 나머지 매개..

for 문for (초기화; 반복문 조건; 반복 처리구문) { 반복처리 내용}forEachfor, for..of와 달리 map(), filter() 등의 반환값을 그대로 루프처리 할 수 있음메서드설명배열.forEach()주어진 콜백함수를 활용하여 배열의 요소를 순서대로 처리([요소], [인덱스],[기존배열])=> {}요소, 인덱스, 기존 배열을 활용하여 처리- 콜백함수에서 인덱스와 기존배열 생략 가능const arr = ['a','b','c']arr.forEach((value, idx)=>{ console.log(value, idx);})sources// [ 짝수 출력]const arr = [1,2,3,4,5]arr.filter((value)=> value %2 ===0).forEach((value)=>{..