본문 바로가기

JavaScript25

[JS] for() / forEach() / map() 함수 비교 1) for() let str = ''; for (let i = 0; i console.log(element)); // Expected output: "a" // Expected output: "b" // Expected output: "c" 배열의 각 요소에 대해 인자로 전달된.. 2023. 8. 18.
[JS Deep Dive] 4장 변수 (식별자, 호이스팅, 식별자 네이밍 규칙, 네이밍 컨벤션) 4.1 변수란 무엇인가 ? 왜 필요한가 ? 변수는 '값을 저장하기 위해 확보한 메모리 공간 자체' 또는 '그 메모리 공간을 식별하기 위해 불린 이름'을 말한다. 사람은 계산과 기억을 모두 두뇌에서 하지만, 컴퓨터는 '연산'과 '기억'을 수행하는 부품이 나누어져 있다. 컴퓨터는 CPU를 사용해서 연산을 하고, 메모리를 사용해 데이터를 기억한다. 메모리란 ? 데이터를 저장할 수 있는 메모리 셀의 집합체 메모리 셀 하나의 크기는 1byte(8bit)이며, 컴퓨터는 메모리 셀의 크기인 1byte 단위로 데이터를 저장하거나 읽어들이고 각 셀은 메모리 주소를 갖는다. 메모리에 저장되는 데이터는 데이터의 종류와 상관없이 모두 2진수로 저장된다. 메모리 주소를 통해 값에 직접 접근하는 것은 치명적인 오류를 발생시킬 가.. 2023. 8. 15.
[JS] 구조 분해 할당이란 ? 구조 분해 할당 var a, b, rest; [a, b] = [10, 20]; console.log(a); // 10 console.log(b); // 20 [a, b, ...rest] = [10, 20, 30, 40, 50]; console.log(a); // 10 console.log(b); // 20 console.log(rest); // [30, 40, 50] ({ a, b } = { a: 10, b: 20 }); console.log(a); // 10 console.log(b); // 20 ({a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40}); console.log(a); // 10 console.log(b); // 20 console.log(rest); // .. 2023. 7. 16.
[JS] filter(), map() 함수 정리 1. Array.prototype.filter() const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present']; const result = words.filter(word => word.length > 6); console.log(result); // Expected output: Array ["exuberant", "destruction", "present"] filter() 메서드는 주어진 함수의 테스트(조건문)를 통과하는 모든 요소를 모아 새로운 배열로 반환합니다. filter는 해석 그대로 필터링, 즉 배열의 요소들을 걸러주는 역할을 하는 함수입니다. 주로 특정 조건을 만족하는 새로운 배열을 필요로 할 때 사용하는.. 2023. 5. 17.
[JS] 자바스크립트 배열의 slice()와 splice() 함수 1) slice() 함수 slice() 함수는 배열로 부터 특정 범위를 복사한 값들을 담고 있는 새로운 배열을 만드는데 사용합니다. 첫번째 인자로 시작 인덱스(index), 두번째 인자로 종료 인덱스를 받으며, 시작 인덱스부터 종료 인덱스까지 값을 복사하여 반환합니다. 여기서 주의할 점은 첫번째 인자로 넘어온 시작 인덱스가 가리키는 값은 포함하지만, 두번째 인자로 넘어온 종료 인덱스가 가리키는 값은 포함하지 않는다는 것입니다. 첫번째 인자도 넘기지 않으면, 배열의 처음 값부터 마지막 값까지 전체를 복제해버리는 효과를 낼 수 있습니다. 두번째 인자를 넘기지 않으면, 시작 인덱스가 가리키는 값부터 배열의 마지막 값까지 모두 복사해줍니다. slice() 함수는 밑에서 다룰 splice() 함수와 달리 아무리 .. 2023. 3. 13.
[JS Deep Dive] 40. Event Part 2 40.5) 이벤트 객체 이벤트가 발생하면 이벤트에 관련된 다양한 정보를 담고 있는 '이벤트 객체'가 동적으로 생성된다. 생성된 이벤트 객체는 이벤트 핸들러의 첫 번째 인수로 전달된다. 클릭하세요. 클릭한 곳의 좌표가 표시됩니다. 위 예제에서는 클릭 이벤트에 의해 생성된 이벤트 객체는 이벤트 핸들러의 첫 번째 인수로 전달되어 매개변수 e에 암묵적으로 할당됨을 알 수 있다. (이는 브라우저가 이벤트 핸들러를 호출할 때 이벤트 객체를 인수로 전달받기 때문이다.) 따라서 이벤트 객체를 전달받으려면 이벤트 핸들러를 정의할 때 이벤트 객체를 전달받을 매개변수를 명시적으로 선언해야 한다. ⭐️ 이벤트 핸들러 어트리뷰트 방식으로 이벤트 핸들러를 등록했다면 다음과 같이 event를 통해 이벤트 객체를 전달받을 수 있다... 2023. 3. 6.

티스토리툴바