본문 바로가기

JavaScript5

[JavaScript] 배열(Array) 사용하기 - 조작(push, pop, shift, unshift) push( ) 배열 마지막에 요소를 추가하고, 추가된 배열의 길이를 반환합니다. 기본 형태 arr.push(ele1, ..., eleN) 한번에 여러 개의 요소 추가 가능 apply를 이용한 배열 합치기 arr1 = [1, 2]; arr2 = [3, 4]; Array.prototype.push.apply(arr1, arr2); // arr1에 arr2의 값을 추가 arr1 = [1, 2, 3, 4] pop( ) 배열 마지막 요소를 제거하고, 그 요소를 반환합니다. 기본 형태 arr.pop() 빈 배열을 제거할 경우, undefined를 반환 pop을 사용한 요소 삭제 arr = [1, 2]; arr.pop() // arr의 마지막 요소인 2가 삭제 shift( ) 배열 첫번째 요소를 제거하고, 그 요소를.. 2022. 3. 29.
[JavaScript] 고차함수 사용하기(filter, map, reduce) 고차함수란? 고차함수는 함수를 인자로 받을 수 있고, 함수의 형태로 리턴할 수 있는 함수입니다. 함수를 인자로 받는 함수에만 한정해 커리 함수라고 합니다. 콜백 함수(callback function)란? 콜백 함수는 다른 함수의 인자로 전달되는 함수입니다. 콜러(caller)란? 콜러는 다른 함수를 인자로 받는 함수입니다. filter filter는 배열 내장 메소드로, 모든 배열의 요소 중에서 특정 조건을 만족하는 요소를 걸러내는 메소드입니다. 조건에 맞는 요소로 이루어진 새로운 배열을 반환하며, 어떤 요소도 조건에 맞지 않으면 빈 배열을 반환합니다. 기본 형태 arr.filter(callback(element, index, arr), thisArg); ◆ callback 배열의 모든 요소를 판단할 함.. 2022. 3. 27.
[HTML] DOM이용하기 DOM이란? DOM은 Document Object Model의 약자로 HTML요소를 Object처럼 조작할 수 있는 Model입니다. console.dir( ) Dom을 객체 모습으로 출력해 다양한 속성을 확인할 수 있습니다. body를 객체 모습으로 출력 console.dir(document.body) querySelector( ) 인자로 셀렉터를 전달하여 HTML 엘리먼트의 정보를 조회할 수 있습니다.셀렉터는 조회하고 싶은 엘리먼트에 따라 HTML 태그("div"), id("#id"), class(".class")처럼 사용합니다.만약 조회하는 대상이 여러개일 경우, 가장 위에 있는 엘리먼트의 정보를 가져옵니다.아래의 예시는 HTML 전체에서 조회하기 위해 document를 사용했지만, 다른 엘리먼트에.. 2022. 3. 27.
[JavaScript] 배열(Array) 사용하기 - 반복(for, of, in, forEach) for 조건이 거짓일 때까지 반복 기본 형태 for ([initialization]; [condition]; [final-expression]){ statement } ◆ initialization 변수 선언 가능 생략 가능 ◆ condition 매 반복마다 확인하는 식 생략하면, 참으로 판단 ◆ final-expression 반복이 끝나면 확인하는 식 생략 가능 for를 이용한 배열 출력 let arr = ['사과', '포도', '토마토']; for ( let i = 0; i { console.log(element) }); 2022. 3. 23.