본문 바로가기

반응형

Javascript

(32)
자바스크립트 - 배열 요소 값 차례대로 출력하기 (forEach() 함수) forEach() 함수를 사용하면 for loop문보다 짧은 코드로 배열 요소를 접근할 수 있다. const array = [1, 2, 3, 4]; array.forEach((element) => console.log(element)); // 1 // 2 // 3 // 4 element 변수는 배열 순환 중, 현재 요소를 의미한다. element 변수의 이름은 아무나 지어도 되지만 요소를 뜻하는 변수 이름을 추천, 예: ele 혹은 element 예제: 배열의 각 요소와 요소의 인덱스 출력하기. const array = [1, 2, 3, 4]; array.forEach((element, index) => { console.log("현재 값: " + element + " | 인덱스 값: " + index)..
자바스크립트 - 2진법, 8진법, 16진법 숫자를 간단하게 10진법으로 변환하기 const binary = 0b101; console.log(binary); // 5 자바스크립트에서 숫자 앞에 진법 접두사(0b, 0o, 0x)가 있으면 자동으로 10진법으로 변환한다. 2진법으로 표기 시 > 예: 0b10 8진법으로 표기 시 > 예: 0o10 16진법으로 표기 시 > 예: 0x10 const octalOne = 0o101;// 소문자 o const octalTwo = 0O101;// 대문자 O console.log(octalOne);// 65 console.log(octalTwo);// 65 숫자 앞에 진법 접두사를 표시할 때, 접두사 끝의 알파벳이 대문사 혹은 소문자이던 상관없다. const binary = "0b101"; const decimal = Number(binary); /..
자바스크립트 - flatMap() 함수 사용법 (flat() 함수와 map() 함수를 합친 함수) flatMap() 함수는 map() 함수와 동일하게 작용하지만 추가적으로 map() 함수 실행 시, 접근하는 각 요소에 flat() 함수를 적용한다. 자세한 정보 - https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/flatMap flatMap() 함수가 map() 함수 와 다른 점. const arr = [1, [2, 3, [4, [5]]]]; const mapRes = arr.map(ele => ele); const flatMapRes = arr.flatMap(ele => ele); console.log(mapRes); // [1, [2, 3, [4, [5]]]] console.log(flatMapRe..
자바스크립트 - flat() 함수 사용법 (배열 속 중첩된 배열들의 요소를 부모 배열에 넣기) const arr = [1, [2]]; 기본적으로 위와 같이, 배열 속에 배열이 있을 수 있다. const arr = [1, [2, [3]]]; 그리고 위와 같이 배열 속에 배열이 그리고 그 속에 있는 배열 속에 배열이, 이렇게 많이 중첩될 수도 있다. flat() 함수를 이용하면, 배열 속 배열들을 평탄화할 수 있다. 평탄화란, 상위 배열 속에 배열들을 없애고 없앤 배열들의 요소들만 상위 배열에 남게 할 수 있다. 예: [1, [2, 3]] 이란 배열을 한 번 평탄화하면, 한 번 중첩된 [2, 3] 배열을 없애고, 그 대신 없앤 배열의 요소들을 상위 배열에 삽입한다. 평탄화 전: [1, [2, 3]] 평탄화 후: [1, 2, 3] 2번 중첩된 배열에 평탄화 시. 평탄화 전: [1, [2, [3]] 평탄..
자바스크립트 - findLastIndex() 함수 사용법 (배열에서 특정 요소의 인덱스 찾기) findLastIndex() 함수는 findLast() 함수와 마찬가지로 배열의 특정 요소를 찾을 경우 사용한다. 두 함수는 요소 검색을 배열의 뒤부터 시작하지만, 차이점은 findLast() 함수는 특정 요소를 반환하고, findLastIndex() 함수는 특정 요소의 인덱스를 반환한다. 자세한 정보 https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/findLastIndex 예제: 요소 값이 4인 요소의 인덱스 찾기 const arr = [1, 2, 3, 4, 4]; const res = arr.findLastIndex(ele => ele === 4); console.log(res); // 4 배열에 요..
자바스크립트 - 배열의 뒤부터 시작으로 특정 요소를 찾아 반환하기 (findLast() 함수) findLast()함수는 find() 함수와 동일하게 특정 요소를 찾을 때 사용하는 함수다. 다만 차이점은 findLast() 함수는 배열의 뒤부터 시작으로 특정 요소를 찾는다. 특정 요소를 찾지 못하면 find() 함수와 동일하게 undefined를 반환한다. 주의점: findLast() 함수 실행 시, 함수 형태의 인수가 반드시 필요하다. const arr = [1, 2, 3]; const res = arr.findLast(3); console.log(res); // Uncaught TypeError: 3 is not a function" 배열에서 3을 찾겠다고 3을 인수로 넣으면 에러가 난다. 에러 메세지를 보면 "3은 함수가 아니다"라고 쓰여있다. 만약 3을 찾겠다면 아래 예제와 같은 코드로 써야..
자바스크립트 - 배열의 특정 요소를 찾아 그 요소의 인덱스 반환하기 (findIndex() 함수) findIndex() 함수는 find() 함수와 동일하게 배열의 특정 요소를 찾을 때 사용하는 함수다. 두 함수의 차이점은 find() 함수는 가장 첫 번째로 찾은 특정 요소를 반환한다. findIndex() 함수는 가장 첫 번째로 찾은 특정 요소의 인덱스를 반환한다. 주의점: findIndex() 함수 실행 시, 함수 형태의 인수가 반드시 필요하다. const nums = [100, 200, 300, 400]; const res = nums.findIndex(); // TypeError: undefined is not a function 인수 없이 함수 실행 시, find() 함수처럼 에러가 난다. 예제: 배열 속, 200 이상의 요소를 찾고 그 요소의 인덱스 반환하기. const nums = [100..
자바스크립트 - 배열의 특정 요소를 찾아 반환하기 (find() 함수) find() 함수는 배열에서 특정 요소를 찾게 하는 함수다. 주의할 점은, 이 함수는 가장 첫 번째로 찾은 요소만 반환하고 종료된다. 예를 들어. [100, 200, 300]이라는 배열에서 100이 넘는 요소를 찾고 싶어 find() 함수 사용 시, 가장 먼저 찾은 200만 반환한다. 예제: 배열에서 100 이상 요소를 찾아 반환하기. const nums = [100, 200, 300]; const res = nums.find(num => num > 100); console.log(res); // 200 결과는 가장 첫 번째로 찾은 200만 반환. 만약 배열 속, 300이 200전에 위치해있었으면 (예: [100, 300, 200]), 300을 반환했을 것. find() 함수 사용 시, 주의점. cons..