Ch.Covelope

JavaScript 배열 기초 정리: 핵심 개념부터 유용한 메서드까지

JavaScript 배열 기초 정리: 핵심 개념부터 유용한 메서드까지안녕하세요! 오늘은 자바스크립트에서 가장 많이 사용되는 데이터 구조 중 하나인 배열(Array)에 대해 심도 있게 다뤄보려고 합니다. 웹 개발을 하다 보면 배열을 다루지 않는 날이 없을 정도로 자주 사용하게 되는데, 이 강력한 도구를 제대로 이해하고 활용한다면 코드의 품질과 성능이 크게 향상될 수 있습니다.이 글에서는 자바스크립트 배열의 기본 개념부터 시작해 실무에서 바로 활용할 수 있는 다양한 메서드, 최신 ES6+ 문법을 활용한 테크닉등을 다룰 예정입니다. 목차자바스크립트 배열 기초배열 생성 방법기본 배열 메서드ES6+ 배열 메서드배열과 함수형 프로그래밍배열 성능 최적화실무 응용 사례마무리 자바스크립트 배열 기초 자바스크립트의 배열은..

※콘솔로 jsx 찍어보고 궁금증이 생겨서 정리하기 JSX 란 JSX는 별도의 언어가 아니라 개발자가 JavaScript 파일에 HTML과 유사한 코드를 작성할 수 있도록 하는 구문 확장이다. UI 구성 요소를 설명하는 더 읽기 쉽고 표현적인 방법을 제공하므로 코드를 더 쉽게 이해하고 유지 관리할 수 있다. JSX 코드는 HTML처럼 보이지만 실제로는 Babel과 같은 도구에 의해 일반 JavaScript로 변환되는 구문이다. 결과 코드는 UI 구성 요소를 만들고 조작하는 JavaScript 함수 호출 집합이다. JSX 코드는 HTML과 유사한 태그와 JavaScript 표현식을 모두 포함할 수 있으므로 개발자가 동적 데이터를 UI 구성 요소에 쉽게 포함할 수 있다. 콘솔을 찍어보고 생긴 궁금증 배열에 J..

Javascript Map map은 배열을 순회하면서 실행되는 콜백함수의 결과값들을 새로운 배열로 반환한다. Array(배열) 에 map 메소드를 사용해서 배열 * 2 값을 만들기. let array = [1, 4, 9, 16]; let result = array.map(x => x * 2); // 배열에 map 메소드를 사용해서 리턴값으로 배열의 원소 *2값을 result 에 할당한다. //화살표함수( 전통적인 함수표현(function)의 간편한 대안) console.log(array) //map 은 원본값은 건드리지 않고 새로운 배열을 생성하여 리턴한다. [1, 4, 9, 16] console.log(result) // 새로운 배열을 생성하여 result의 할당한 결과값. [2, 8, 18, 32] ..

Javascript 연습 문제 풀이(split, array, for) split, array, for을 이용한 간단한 문제 풀이해보기. 문자열을 split 로 하나씩 자르고 숫자로 더하고 평균 구하기. let data = '5, 4, 10, 2, 5'.split(',') // '5, 4, 10, 2, 5' 는 하나의 문자열 // split 으로 문자열을 일정한 구분자로 잘라서 배열로 저장 let result =0; // 결과값을 담을 변수 선언과 0 할당. for (let i of data){ // 스플릿된 문자열을 for of 배열을 순환한다. result += parseInt(i)/data.length; // 순환 되면서 정수로 반환한 값을 배열의 길이만큼 나누고 결과값에 더해진다. } // 하지만 ..