자바스크립트 배열 최대값, 최소값 찾기

원본: 배열의 최소값 및 최대값 요소 가져오기 사용자에게 통계를 보여주거나 슬라이더의 경계를 설정할 때 배열에서 최대값, 최소값을 알아내야합니다. 이 포스트에서는 자바스크립트 배열에서 최소/최대 값을 알아내는 여러가지 방법을 알아보고 이들 사이의 속도를 비교해 보겠습니다. Math를 이용해 최대값, 최소값 얻기 Math 객체는 수학적 계산을 위한 유용한 메소드와 상수를 포함하는 자바스크립트의 빌트인 객체입니다. 여기서는 Math.min()과 Math.max() 두 개의 … Read more

자바스크립트 배열(Array) 생성

원본: 자바스크립트 배열 – 배열 생성 방법 배열은 순서가 있는 요소의 목록을 가지는 자료구조입니다. 이 포스트에서는 자바스크립트를 사용하여 배열을 생성하는 4 가지 방법을 알아보겠습니다. 할당 연산자로 배열 생성 자바스크립트에서 가장 일반적으로 배열을 만드는 방법은 다음과 같이 배열 변수를 할당하는 것 입니다: 개발자 도구를 켜고 console.log() 메소드를 사용하여 배열 값을 확인하면 4 개의 요소를 가진 배열이 … Read more

자바스크립트 배열 무작위로 섞기 (shuffle)

원본: 자바스크립트로 배열 섞기 자바스크립트로 배열을 섞는 방법에는 Fisher-Yates 알고리즘, sort() 메소드, Lodash 함수 등이 있습니다. 이러한 배열을 섞는 작업은 무작위 데이터를 만드는 알고리즘 등에 필요한 일반적인 작업입니다. 다양한 방법을 활용해 프로젝트에 가장 적합한 방법을 적용할 수 있습니다. 이 포스트에서는 네 가지 배열 섞기 알고리즘에 대해 알아보겠습니다. Fisher-Yates 알고리즘으로 배열 섞기 Knuth shuffle 이라고도 알려진 … Read more

자바스크립트 배열 중복 제거

원본: 자바스크립트의 배열 중복 제거하는 3가지 방법 개발을 하다보면 배열에 있는 중복된 요소를 제거해야 하는 경우가 빈번히 발생합니다. 마트에서 같은 항목의 목록을 한 번만 인쇄해야 하거나, 기록이 중복된 학생을 제거하는 등 형태는 무한합니다. 이 포스트에서는 이런 다양한 형태의 중복된 요소를 여러가지 빌트인 메소드를 활용하여 제거하는 방법을 알아보겠습니다. Set 객체로 중복 제거 Set 객체를 사용하면 고유한 … Read more

자바스크립트 배열 검색 (filter, find, includes, indexOf)

원본: 4 가지 자바스크립트 배열 검색 방법 자바스크립트에는 배열에서 항목을 검색하는 다양한 방법이 있습니다. 이 중 적합한 방법을 선택하는 것은 사용 사례에 따라 다릅니다. 예를 들면, 특정 조건을 충족하는 배열의 모든 항목을 가져오고 싶을 때, 조건을 충족하는 항목이 있는지 확인하고 싶을 때, 특정 값이 배열에 있는지 확인하고 싶을 때, 아니면 배열에 있는 값의 인덱스를 찾고 … Read more

Array.find 자바스크립트 배열 특정 값 찾기

원본: Exploring Array Find in JavaScript Array.find() 메소드는 ECMAScript 2015(ES6)에 도입되어 모든 최신 브라우저에서 지원되는 메소드입니다. 이 메소드는 배열내의 모든 요소를 검색하여 일치하는 첫 번째 요소를 리턴하거나 찾지 못한 경우 undefined를 리턴합니다. 리턴 값은 동적으로 array, string, number, object 등의 모든 자바스크립트 타입이 될 수 있습니다. 배열 내의 항목을 찾는 기능 면에서는 Array.filter() 메소드와 비슷하지만 … Read more

Array.reverse 자바스크립트 배열 뒤집기

원본: 자바스크립트 배열 거꾸로 뒤집기: reverse() 메소드 이 포스트에서는 자바스크립트의 배열을 거꾸로 뒤집는 두 가지 방법에 대해 알아보겠습니다. Array 객체의 reverse() 메소드는 마지막 항목을 첫 번째 항목으로 만들고, 첫 번째 항목을 마지막 항목으로 만들어 배열을 반대로 바꿉니다. 그 사이에 있는 다른 항목들도 역시 각각 반전됩니다. reverse() 메소드 사용 방법을 알아보기 전에 메소드를 사용하지 않고 자바스크립트 … Read more

Array.includes 자바스크립트 배열 특정 값 포함 확인

원본: 자바스크립트 배열에 항목이 있는지 확인 – Array.includes() 자바스크립트의 메소드를 사용하면 특정 요소가 배열에 있는지 확인할 수 있습니다. 또한 이를 이용해 문자열 내에 하위 문자열이 있는지 확인할 수도 있습니다. 찾고자 하는 항목이 배열이나 문자열에 있으면 true를 리턴하고 항목이 없으면 false를 리턴합니다. 이번 포스트에서는 자바스크립트의 includes() 메소드를 사용하여 특정 항목이 배열 내에 있는지, 문자열 내의 하위 … Read more

Array.sort 자바스크립트 배열 정렬 (오름차순, 내림차순)

원본: JavaScript Sort Array – How to Sort an Array Accurately 개발을 하다보면 데이터를 정렬해야 하는 경우가 있습니다. 데이터 정렬 결과가 정확하지 않으면 전체 코드 오작동이나 버그가 발생할 수 있으므로 항상 정확히 정렬해야 합니다. 이번 포스트에서는 자바스크립트에서 배열을 정렬하는 방법을 알아보고, sort() 메소드와 관련된 몇 가지 단점과 보다 정확한 결과를 얻을 수 있는 방법을 살펴보겠습니다. … Read more

Array.concat 자바스크립트 배열 합치기

원본: How to Merge Arrays in JavaScript – Array Concat 자바스크립트로 배열 작업 시 여러 배열을 병합해야하는 경우가 있습니다. 이는 서로 다른 소스에서 온 관련 데이터를 하나의 단일 배열로 합쳐야 하는 경우를 예로 들 수 있습니다. 이렇게 배열을 합치는 방법은 여러가지가 있습니다. 이 포스트에서는 복잡한 방법부터 간단한 방법까지 3 종류의 방법을 알아보겠습니다. 1. Array.concat 메소드로 … Read more

자바스크립트 배열의 모든 값 더하기 (for, forEach, reduce)

원본: https://www.freecodecamp.org/news/how-to-add-numbers-in-javascript-arrays/ 자바스크립트의 배열은 하나의 변수에 여러개의 값을 순서대로 저장하고 다양한 방법으로 값을 조작하게 해주는 객체입니다. 이 포스트에서는 여러 가지 방법으로 주어진 배열에 있는 모든 숫자의 합계를 계산하는 방법을 알아보겠습니다. 다음 방법을 사용해 배열에 있는 모든 숫자의 합계를 찾는 방법을 알아보겠습니다: 자바스크립트 for 루프를 사용해 배열의 합계 얻기 가장 간단하게 배열에 있는 모든 숫자의 합을 … Read more

Array.reduce 자바스크립트 사용 방법

원본: https://www.freecodecamp.org/news/reduce-f47a7da511a9/ 자바스크립트의 reduce 메소드는 함수형 프로그래밍의 기본 중 하나입니다. 어떻게 작동하는지, 언제 사용해야 하는지, 어떤 일을 할 수 있는지 하나하나 살펴보겠습니다. reduce 메소드 기본 이 메소드로는 돈의 액수가 나열된 배열이 있고 그 금액을 모두 더하고 싶을 때 사용할 수 있습니다. 개발자 도구에서 코드를 실행하면 위의 화면과 같은 결과를 얻을 수 있습니다. 사용 방법: ES5 … Read more

Array.slice 자바스크립트 배열 자르기

원본: https://hackernoon.com/understanding-javascripts-array-slice-method 자바스크립트의 slice 메소드는 배열의 일부분을 얕은 복사본(shallow copy)으로 리턴합니다. 매개변수로는 start와 end 두 개의 값을 받으며 모든 배열에서 slice 메소드를 사용할 수 있습니다. 개발자 도구에서 다음의 간단한 예제를 확인해 보겠습니다: 이 메소드에는 start와 end 라는 두 가지 옵셔널 매개변수가 있습니다. 원하는 경우 둘다 사용할 수도 있고 start만 사용하거나 둘 다 사용하지 않을 수 … Read more

Array.join 자바스크립트 배열 합치기

원본: https://jsremote.jobs/tutorials/join/ 배열은 자바스크립트 프로그래밍에서 필수로 사용됩니다. 이러한 배열에는 다양한 메소드가 있는데 이 중 문자열을 하나로 합치는 기능은 반드시 알아야할 메소드 중 하나입니다. 이 포스트에서는 배열 원본을 변경하지 않고 모든 요소를 하나의 문자열로 리턴하는 join() 메소드에 대해 알아보겠습니다. join 메소드 자바스크립트의 join() 메소드는 배열의 모든 요소를 연결하여 하나의 문자열을 생성합니다. 이 배열 요소들은 쉼표나 기호 … Read more

자바스크립트 배열에서 특정 요소 제거

원본: 자바스크립트 배열에서 요소 제거 자바스크립트의 배열은 여러 값을 묶을 수 있고 그 값에 루프를 돌 수 있게 해줍니다. 이를 통해 다양한 방법으로 값을 추가하거나 제거할 수 있습니다. 하지만 단순한 Array.remove() 메소드는 존재하지 않습니다. 그 대신 자바스크립트 배열은 값을 정리할 수 있는 다양한 방법을 제공합니다. 예를 들면 pop() 메소드를 통해 배열의 끝부터, shift() 메소드로 배열의 … Read more

shift unshift 자바스크립트 배열 추가/제거

원본: https://careerkarma.com/blog/javascript-shift-unshift 자바스크립트의 shift() 메소드는 배열의 첫 번째 요소를 제거하고 뒤에 있는 요소들을 한 칸 씩 당깁니다. 반면 unshift() 메소드는 배열의 첫 번째 항목에 새 요소를 추가하고 원래 있던 요소들을 한 칸 씩 뒤로 밉니다. 이 메소드들을 사용하면 배열의 시작 부분에서 항목을 추가하거나 제거할 수 있습니다. push(), pop() 메소드는 배열의 끝에 요소를 추가/제거하는 반면 shift(), … Read more

push pop 자바스크립트 배열 추가/제거

원본: pop and push: Learning Javascript’s Array Methods 이 포스트에서는 배열에 항목을 추가하는 push() 메소드와 항목을 제거하는 pop() 메소드에 대해 알아보겠습니다. push pop 작동 방식 배열의 끝에 항목을 추가하려면 push() 메소드를 사용하고 배열의 끝에서 항목을 제거하려면 pop() 메소드를 사용합니다. 개발자 도구에서 다음의 예제 코드를 입력하고 console.log() 메소드를 통해 테스트할 수 있습니다. 여기서는 push() 메소드를 사용하여 … Read more

Array.filter 자바스크립트 배열 필터링

원본: https://www.freecodecamp.org/news/filter-arrays-in-javascript/ 대화형 앱을 만들다 보면 긴 목록을 필터링하는 버튼과 같이 동적인 기능을 넣어야 할 때가 있습니다. 또한 지정된 조건에 일치하는 항목만 리턴하도록 다수의 배열을 조작해야 할 수도 있습니다. 이 포스트에서는 자바스크립트 배열을 필터링하는 두 가지 방법을 알아보고 필터링된 요소로 이루어진 새 배열을 리턴하는 방법도 알아보겠습니다. for 문 으로 배열 필터링 ES6가 도입되기 전에는 배열을 … Read more

Array.splice 자바스크립트 배열 요소 추가/제거

원본: splice 자바스크립트 배열 메소드 사용 방법 splice() 메소드는 자바스크립트 Array 객체의 빌트인 메소드입니다. 이는 배열의 요소를 제거하거나 새 요소로 교체하여 배열의 내용을 변경할 수 있습니다. 또한 이 메소드는 원본 배열을 수정하고 제거된 요소를 새 배열로 리턴합니다. 이 포스트에서는 splice() 메소드를 사용하여 배열 요소를 제거, 추가, 교체하는 방법을 알아보겠습니다. 먼저 배열 요소를 제거하는 방법을 알아보겠습니다. … Read more

Array.map 자바스크립트 배열 매핑

원본: https://linuxhint.com/map-array-in-javascript-array-map-method/ 다른 프로그래밍 언어와 비슷하게 자바스크립트는 데이터를 저장하는 다양한 데이터 타입을 제공합니다. 이러한 데이터 타입 중에는 배열도 있습니다. 배열은 단일 변수에 여러 값을 저장하는 그룹을 의미합니다. 자바스크립트는 배열에 저장된 데이터를 관리, 구성, 접근할 수 있도록 Array 객체를 제공합니다. map 메소드 자바스크립트 Array의 map() 메소드는 원본 배열을 변경하지 않고 각각의 요소에 콜백 함수를 호출하여 새로운 … Read more