Map 정의된 배열의 값을 오름차순으로 접근하여 callback fn을 통해 새로운 값을 정의하고 신규 배열을 만들어 반환한다 Map 정의된 배열의 값을 오름차순으로 접근하여 callback fn을 통해 새로운 값을 정의하고 신규 배열을 만들어 반환한다
Array.prototype.map(callbackfn [, thisArg ]) Array.prototype.map(callbackfn [, thisArg ])
– 사용법: 3가지 인자(요소값, index, 순회할 대상 객체) – 사용법: 3가지 인자(요소값, index, 순회할 대상 객체)
const numbers = [1];numbers.map(((number, index, source) = {// number:요소값 // index: source 에서 요소의 index // source: 순회하는 대상 console.log(number);// 1 console.log(index);// 0 console.log(source);// [1] returnumber] * number;}; const numbers = [1];numbers.map(((number, index, source) = {// number:요소값 // index: source 에서 요소의 index // source: 순회하는 대상 console.log(number);// 1 console.log(index);// 0 console.log(source);// [1] returnumber] * number;};
// 프로그래밍 이름 길이 구하기 const programingLanguages = [“javascript”, “java”, “c#”, “c++”, “c”];const lengthOfProgramingLanguages = programingLanguages.map(language => language.length); console.log(lengthOfProgramingLanguages); // [10, 4, 2, 3, 1]; // 프로그래밍 이름 길이 구하기 const programingLanguages = [“javascript”, “java”, “c#”, “c++”, “c”];const lengthOfProgramingLanguages = programingLanguages.map(language => language.length); console.log(lengthOfProgramingLanguages); // [10, 4, 2, 3, 1];
Map Features Map Features
※ Use of higher-order functions ※ Use of higher-order functions
const numbers = [1, 2, 3, 4, 5];// 제곱근 구하기 const squares = numbers.map(Math.sqrt);console.log(squares);// [1, 1.4142135623730951, 1.7320508075688772, 2, 2.236067974979] // 곱 구하기 const double = value => value * 2;consolesoles.map(doubles.m(dup) const numbers = [1, 2, 3, 4, 5];// 제곱근 구하기 const squares = numbers.map(Math.sqrt);console.log(squares);// [1, 1.4142135623730951, 1.7320508075688772, 2, 2.236067974979] // 곱 구하기 const double = value => value * 2;consolesoles.map(doubles.m(dup)
※ 새로운 유형의 값을 작성합니다 ※ 새로운 유형의 값을 작성합니다
constusers = [{ name: ‘YD’, age: 22} 、{ name: ‘Bill’, age: 32} 、{ name: ‘Andy’, age: 21} 、{ name: ‘Rocky’, ‘age: 35} 、console.log(ages); // [22, 32, 21, 35] constusers = [{ name: ‘YD’, age: 22] 、{ name: ‘Bill’, age: 32] 、{ name: ‘Andy’, age: 21} 、{ name: ‘Rocky’, ‘age: 35} 、console.log(ages); // [22, 32, 21, 35]
※ 특정 요소만 재정의합니다 ※ 특정 요소만 재정의합니다
const users = [{ name: ‘YD’, age: 22 }、{ name: ‘Bill’, age: 32 }、{ name: ‘Andy’, age: 21 }、{ name: ‘Rocky’, age: 35}}、constnewUsers=user.map(user=>{if(user.name } ‘YD’)}、{returnelog, ‘…user’, ‘}; // consolegole.log(newusers, “{name : 32歳), “{、 年齢: 35 }] const users = [{ name: ‘YD’, age: 22 }、{ name: ‘Bill’, age: 32 }、{ name: ‘Andy’, age: 21 }、{ name: ‘Rocky’, age: 35}}、constnewUsers=user.map(user=>{if(user.name } ‘YD’)}、{returnelog, ‘…user’, ‘}; // consolegole.log(newusers, “{name : 32歳), “{、 年齢: 35 }]
※ 문자를 배열로 바꿉니다 ※ 문자를 배열로 바꿉니다
const 메시지 = ‘Hello world’;const newMessage = Array.prototype.map.call(Message, char = ‘${char}’);console.log(newMessage);/ [“H”, “e”, “l”, “o”, “w”o”, “r”l”, “d”] const 메시지 = ‘Hello world’;const newMessage = Array.prototype.map.call(Message, char = ‘${char}’);console.log(newMessage);// “e”, “l”, “o”, “w”o”, “r”l”, “d”, “d”]
※ React를 적용합니다 ※ React를 적용합니다
関数 contacts() {const contactData = [{ name: “YD”, phone: “010-0000-0001” }, { name: “Bill”, phone: “010-0000-0002” }, { name: “Andy”, phone: “010-0000-0003” }, { name: “Rocky”, phone: “010-0000-0004” ];return (div> contacts </h> <h> <di> <data l> <map kindex=。電話} />; })}</ul></div>;} 関数 contacts() {const contactData = [{ name: “YD”, phone: “010-0000-0001” }, { name: “Bill”, phone: “010-0000-0002” }, { name: “Andy”, phone: “010-0000-0003” }, { name: “Rocky”, phone: “010-0000-0004” ];return (div> contacts </h> <h> <di> <data l> <map kindex=。電話} />; })}</ul></div>;}
map문제를한번풀어보도록하겠습니다 map문제를한번풀어보도록하겠습니다
= [“스티븐 폴 잡스”, “빌 게이츠”, “마크 엘리엇 저커버그”, “엘론 머스크”, “제프 베조스”, “워런 에드워드 버핏”, “래리 페이지”, “래리 엘리슨, 팀 쿡 “로이드 블랭크페인’] = [스티븐 폴 욥스”’, ”’빌 게이츠버그”’와 같은 사람들이 있다. “팀 쿡” 로이드 블랭크페인’;
1. 모든 이름을 대문자로 인쇄합니다 1. 모든 이름을 대문자로 인쇄합니다
//예시、uperCaseName = names.map(((item) にする=>item.toUpperCase()// 매개변수가 없는 함수는 괄호가 필요:() = {statements } console.log(upperCaseName)//내 답변let upperCaseName = names.map(names=>names.toUpperCase())console.log(upperCaseName) //예시、uperCaseName = names.map(((item) にする=>item.toUpperCase()// 매개변수가 없는 함수는 괄호가 필요:() = {statements } console.log(upperCaseName)//내 답변let upperCaseName = names.map(names=>names.toUpperCase())console.log(upperCaseName)
2. 성을 제외한 이름만 출력합니다. (예-[“Steven”,“Bill”,“Mark”,“Elon”···]) 2. 성을 제외한 이름만 출력합니다. (예-[“Steven”,“Bill”,“Mark”,“Elon”···])
//예시let firstNames = names.map((アイテム)=>item.split(‘ ‘)[0])console.log(firstNames)//내답변let firstNames = names.map((str)=>str.split(‘ ‘)[0])console.log(firstNames)let firstAlph = names.map(str)=>str.split(‘][0])console.log(firthAlph(firstAlph)) //예시let firstNames = names.map((アイテム)=>item.split(‘ ‘)[0])console.log(firstNames)//내답변let firstNames = names.map((str)=>str.split(‘ ‘)[0])console.log(firstNames)let firstAlph = names.map(str)=>str.split(‘][0])console.log(firthAlph(firstAlph))
3. 이름의 이니셜만 출력합니다. (예-[“SPU”,“BG”,“MEZ”,“EM”···]) 3. 이름의 이니셜만 출력합니다. (예-[“SPU”,“BG”,“MEZ”,“EM”···])
//예시 let initialOnly = names.map((item) = {let splitName = item.split(” “};let initial = “”; splitName。forEach((nameItem) => (initial += name)項目 [0]);//반환값이 없다 ごとに、문과 같이 작동한다 return initial;})console.log(initialOnly)//내답변 //예시 let initialOnly = names.map((item) = {let splitName = item.split(” “};let initial = “”; splitName。forEach((nameItem) => (initial += name)項目 [0]);//반환값이 없다 ごとに、문과 같이 작동한다 return initial;})console.log(initialOnly)//내답변