본문 바로가기

JavaScript29

JavaScript <콜백 함수 2> 배열 - 콜백함수의 인자값function (value, index, array): 순회되는 각 요소의 값, 순회되는 각 요소의 인덱스 번호, 배열 그 자체>> 기본적으로 반복에 대한 기능을 포함>> 콜백함수의 인자값은 필수 사항이 아니다 (value만 사용하는 경우 많음)사용하지 않을 경우 작성하지 않는다. 1. forEach()- 각각 요소에 대해 함수를 실행- 단순하게 배열 내부의 요소르 사용해서 콜백함수르 호출  const 재할당 >> const로 선언된 배열의 요소값이 변경: const가 가지는 불변성은 해당 값이 가지는 참조값(재할당 불가) 2. map- 배열의 각 요소에 대해 함수를 적용하고 '새로운 배열을 생성하여 반환'- 콜백 함수에서 리턴한 값들을 기반으로 새로운 배열을 생성- 요소 의 .. 2024. 5. 31.
JavaScript <콜백 함수 1> 콜백 함수의 기본- 'JS함수'는 자료형이기 때문에 변수 할당 가능 OR 함수를 함수의 매개변수로 전달 가능1) 콜백 함수(callback)- 다른 함수에 인자로 전달되어, 그 함수의 내부에서 실행되는 함수- 코드의 실행을 나중에, 즉 어떹 이벤트가 발생한 후나 다른 함수의 실행이 완료된 후에 진행 가2) 콜백 함수의 중요성 -비동기 처리: JavaScriopt는 웹 브라우저에서 사용되며,사용자의 입력, 파일로딩 등 비동기적 이벤트를 자주 다룸- 콜백 함수 사용 시 비동기 작업의 완료 시점에 원하는동작을 실행 가능-이벤트리스너: 사용자의 행동에 반응하기 위해 이벤트 리스너 내부에서 콜백함수를 사용ex)  버튼클릭, 키보드 입력 등에 애한 반응로 함수를 실행-모듈성과 재상용성 향상3) 콜백함수의 응용 사례.. 2024. 5. 30.
JavaScript <array.2> 1. 배열 스프레드 연산자와 복사 1) 배열 스프레드 연산자- ES6에 도입된 기능- 배열 또는 객체의 요소를 개별 요소로 확장하거나 여러 요소를 하나의 배열로 결합할 때 사용-  ... 형태로 사용(1)배열 복사- 배열의 모든 요소를 새 배열에 복사- [...요소를복사할배열명] (2)배열 병합두 개 이상의 배열을 병합할 경우 사용병합된 새 배열은 기존 배열들을 변경하지 않는다.  3) 깊은 복사와 얕은 복사의 차이(1) 얕은 복사객체의 최상위 수준의 속성만 복사하는 것을 의미복사된 객체에서 중첩된 객체를 변경하면 원본에도 영향- 스프레드 연산자를 사용해 구현 가능- 배열의 경우 요소값을 새롭게 전달(2) 깊은 복사객체에 포함된 모든 수준의 속성을 완전히 새로운 복사본으로 생성복사된 객체를 변경해도 원본.. 2024. 5. 29.
JavaScript <array 1> 1. 배열(Array)배열(Array)은 '여러 개'의 값은 '순차적'으로 나열한 자료 구조- 다양한 타입의 데이터를 하나의 변숭 저장- 각각의 데이터는 인덱스(index)번호값을 가짐 해당 값을통해 데이터에 접근-인덱스의 시작 값은 '0'-배열의 각각의 데이터 - '요소'- 크기가 고정되어 있지 않다, 프로금램 실행 중 동적으로 사용 가능 2. 배열의 사용 목적- 접합적 데이터 관리 용이-순차적 접근-다양한 데이터 타입을 함께 저장-효율적ㅇ니 데이터 처리 3. 배열 생성1) 리터럴 방식으로 배열 생성- 가장 직관적이고 간단함- [] (대괄호)안에 원하는 요소를 ,(콤마)로 구분하여 나열 1) 배열의 이름은 여러개의 데이터를 담는 큭성을 살려(복수형태로 작성을 권장)>> 콜론(:)이나 콤마(,)의 경우 .. 2024. 5. 28.
JavaScript <즉시 호출> 1. 즉시 호출 함수- IIFE (Immediately Invoked Function Expression) IIFE 정의- 정의되자마자 즉시 호출(실행)되는 함수- 주로 변수의 스코프(변수가 유효한 범위, 지역)를 제한하여 전역 스코프의 오염을 방지하느 데 사용>> 전역 변수는 코드 어디에서난 접근 가능하기 때문에 의도치 않은 변경이 발생 가능>> 이를 방지하기 위한 하나의 기법이 IFTE - 확용: 초기화 코드 실행이 필요할 때 사용하며, 글로벌 스코프를 오염시키지 않기위해 사용 IFTE의 대표적 형태- 익명함수를 생성하고 즉시 호출- 정의된 직후 자동으로 실행되는 함수 - 초기화 코드 실행이 필요할 때 유용하게 사용- 전역 스코프에 영향을 주지 않으면서 필요한 코드를 실행 가능  1) 이름 충돌 문제.. 2024. 5. 27.
JavaScript <function3> 기본매개변수 & 나머지 매개변수 1. 기본 매개 변수 (Default)- 함수에 인자를 전달하지 않았을 때 사용되는 기본값을정의- 함수의 매개변수가 undefinded인 경우에도 함수가 정상적으로 동작하도록 구현- 함수 호출 시 특정 매개변수를 생략 가능 2. 구현 방법- 함수 선언 시 매개변수명 뒤에 '='연산자를 이용하여 기본값을 할당 - 전달되는 인자가 없을 경우 - 파라미터에 초기화되니 않는 경우 기본 매개변수가 사용- 전달 되는 인자가 있을 경우 - 해당 인자값이 사용  2. 가변 매개변수- 함수가 받을 수 있는 매개변수의 수가 변할 수 있다는 것을 의미- 함수를 호출할 때 인자의 수가 정해져 있지 않고, 함수 내부에서 유동적으로 처리 3. 나머지 매개변수(Rest)- JS - 나머지 매개변수를.. 2024. 5. 26.