본문 바로가기

JavaScript47

[JavaScript] DOM - 모든 요소와 요소의 어트리뷰트, 텍스트를 각각의 객체로 만들고 이들 객체를 부자 관계를 표현할 수 있는 트리 구조로 구성한 것이다. - JavaScript를 통해 동적으로 변경할 수 있다. - HTML 문서에 대한 모델 구성 : HTML 문서를 로드한 후 문서에 대한모델을 객체의 트리(DOM tree)로 메모리에 생성한다. - HTML 문서 내의 각 요소에 접근 / 수정 : DOM은 각 객체에 접근 및 수정이 가능하며 브라우저를 통해 보게 될 내용 또한 변경된다. (1) DOM tree - 문서 노드 : DOM tree에 접근하기 위한 시작점(entry point)이다. 트리의 최상위에 존재하며 각각 요소, 어트리뷰트, 텍스트 노드에 접근하려면 문서 노드를 통 해야 한다. - 요소 노드 : HTML .. 2023. 10. 30.
[JavaScript] Higher order function - 함수를 인자로 전달받거나 함수를 결과로 반환하는 함수를 말한다. - 인자로 받은 함수를 필요한 시점에 호출하거나 클로저를 생성하여 반환한다. ​ (1) 고차 함수 종류 - .sort() : 배열의 요소를 오름차 순으로 정렬 Unicode 코드 포인트 순서를 따른다. - .reverse() : 배열의 요소를 내림차 순으로 정렬한다. - .foreach() : for문 대신 사용 가능, break문을 사용할 수 없다. - .map() : 배열을 순회하며 요소의 값을 새로운 값으로 변경한다. 원본은 변경되지 않는다. - .filter() : 배열을 순회하면서 각 요소에 대해 인자로 주어진 결과가 true인 값만 새로운 배열로 반환한다. var a = [40, 100, 1, 5, 2, 25, 10]; con.. 2023. 10. 30.
[JavaScript] Array - 1개의 변수에 여러 개의 값을 순차적으로 저장할 때 사용한다. - Array() 생성자 함수 : const arr = new Array(1,2,3); - 배열 리터럴 방식 : const arr = [1,2,3]; 주로 사용한다. - array.length : 배열의 길이를 나타낸다. ​ (1) 배열의 추가와 삭제 - 배열은 동적으로 요소를 추가나 삭제할 수 있다. var a = []; a[0] = 1; a[2] = 3; console.log(a); // [ 1, , 3 ] console.log(a.length); // 3 delete a[3]; // 요소 값만 삭제 console.log(a); // [ 1, ] a.splice(1,2); // 요소를 완전히 삭제 console.log(a); // [ .. 2023. 10. 26.
[JavaScript] String - 원시 타입인 문자열을 다룰 때 유용한 프로퍼티와 메서드를 제공하는 레퍼 객체이다. - 생성자 함수 호출 : var a = new String('wangi'); - 원시 타입 문자열 : let y = 'wangi'; - 일반적으로 원시 타입 문자열을 사용한다. - new를 사용하지 않으면 문자열 리터럴을 반환한다. (1) String Property - String.length : 문자열 내의 문자 개수를 반환한다. var a = 'parkwangi'; console.log(a.length); // 9 (2) String Method - .charAt() : 인수로 전달한 index에 해당하는 위치의 문자를 반환 범위를 벗어날 경우 빈 문자열을 반환한다. - .concat() : 인수로 전달한 1개 이.. 2023. 10. 26.