UX·UI - FrontEnd Dev. Story

배열 7

[JS] reduce() 내장메서드 함수 파악하고 써먹어보기

reduce() 기본 문법 reduce() 메서드는 배열의 각 요소에 리듀서(reducer) 함수를 실행하고, 하나의 결과값을 반환. reduce라는 이름은 배열들을 하나의 값으로 줄이는데 쓰이기 때문에 붙었다. 예로, 배열에 들어있는 숫자를 더하거나 평균을 구하는 것은 배열을 하나의 값으로 줄이는 동작이다. 하지만 reduce가 반환하는 값은 객체일 수도 있고, 다른 배열일 수도 있다. arr.reduce(callback[, initialValue]) 리듀서 함수는 네 개의 인자를 가집니다. 누산기 accumulator (acc) 현재 값 currentValue (cur) 현재 인덱스 currentIndex (idx) 원본 배열 array (src) ◻ accumulator - 콜백의 반환값을 누적한다..

자바스크립트 < 비구조화 할당 (구조분해 할당)에 대해 알아보기>

변수에 넣어논 특정값들을 변수에 쉽게 담을 수 있는데 그것을 비구조화 할당이라고 한다. 만약 비구조할당이 없을때는 어떻게 작업을 해야했는지에 대한 불편함을 알아보자. 1. 배열 데이터값을 이용한 비구조화 할당 const names = ["Chloe", "Jake", "David", "Tom"]; const name1 = names[0]; const name2 = names[1]; const name3 = names[2]; const name4 = names[3]; console.log(name1);//Chloe console.log(name2);//Jake 이렇게 배열에 담긴 값들을 변수 하나 하나 각자 생성해서 각 [ index ] 넘버를 지정 설정하면서 할당했다. 4개까지는 쌉가능이지만... 만약 배..

JS 문자열 내장함수 - slice/indexOf/substr/replace/split - 자바스크립트

1. indexOf( ) - 찾고자하는 문자열의 위치 반환 2. slice( ) - 문자열에서 특정 부분 찾아서 새로운 문자열로 반환 3. substr( ) - 문자열에서 특정 부분 잘라냄 4. replace( ) - 문자열에서 특정 문자값 바꿔치기 5. split( ) - 문자열을 배열로 반환 1. 문자열.indexOf() - 찾고자하는 문자열의 위치 반환 const txt = "Hello World"; console.log(txt.indexOf("apple")); // -1 apple이란 단어를 찾기했을 때, 값이 없으면 -1을 반환한다. 만약 글자가 있다면 그 글자의 위치를 찾아서 숫자로 반환. indexOf는 단어가 있는지 없는지 확인할 때 사용을 많이 한다고한다. 2. 문자열.slice() - ..

배열전용 내장함수 반복문 forEach() / map() 자바스크립트 JS 공부

자바스크립트에 미리 포함 된 함수를 내장함수라 한다. 배열에 사용하는 반복문 내장함수에는 forEach() / map() 이 있는데 알아보자. forEach() / map() 에는 파라미터(인자)값이 3가지가 들어간다. ex) forEach( el, idx, arr ) el : 반복 돌고있는 대상 idx : 순서값 arr : 배열자체 1. forEach() const colors = ["red", "green", "blue"]; colors.forEach((el, idx, arr) => { //파라미터에는 3가지가 default.(반복도는 대상, 순서값, 배열자체 ) console.log(el); //red green blue console.log(idx); // 0 1 2 console.log(arr)..

자바스크립트 for / for of / for in 반복문 사용법 - JS

1. for() 반복문 1-1) 배열에서 for() 이용하기 // 배열에서 사용법 const colors = ["red","green","blue","aqua"]; for( let i=0; i < colors.length; i++ ){ console.log(colors[i]); //red green blue aqua } 1-2) 객체에서 for() 이용하기 // 객체에서 사용법 const classA = [ {name: "Chloe", age: 20, address: "Seoul"}, {name: "Andy", age: 25, address: "Busan"}, {name: "Jane", age: 18, address: "Daegu"}, ]; for(let num=0; num < classA.length;..

자바스크립트 함수 사용해서 rest 파라미터 / for of 배열 만들기

1. Rest Parameters [파라미터] : (...args) - 인자를 모두 배열 형태로 전달하는 파라미터 // * Rest 파라미터 사용하기 function printAll(...args) { //...args는 -> printAll('A', 'B', 'C')의 값이 담겨있는 배열 for (let i = 0; i < args.length; i++) { // printAll의 값이 length를 통해 3개의 배열이 i에 담긴다. console.log(args[i]); // 'A' // 'B' // 'C' } } printAll('A', 'B', 'C'); 2. for ( arg of args ) 사용한 더 간단한 작업방법 function printAll(...args) { // for ( arg ..

[Javascript] 자바스크립트 기초 배열 문법 활용하기

배열 배열은 여러개의 데이터를 순차적으로 저장하는 저장소이며, 사용하는 방법이 다양합니다. 1.문법 var 변수명 = [값1, 값2, 값3......] 배열 사용하는 방법 01 배열을 선언하고 데이터를 순차적으로 선언하는 방법입니다. var arr1 = new Array(); arr1[0] = 100; //첫번째 배열 저장소에 100을 저장 arr1[1] = 200; //두번째 배열 저장소에 200을 저장 배열 사용하는 방법 02 배열을 선언과 동시에 데이터를 넣는 방법입니다. var arr2 = new Array(100,200); 배열 사용하는 방법 02 배열을 선언하지 않고 바로 데이터를 넣는 방법입니다. var arr3 = [100,200]; 2. 배열 객체의 메서드 / 속성 종류 설명 join()..

반응형