[자바스크립트] map, includes, toString, join의 사용 예제

.map(callback)

---

map() 메서드는 배열 내의 모든 요소 각각에 대하여 한 번씩 순서대로 값을 가져와 그 함수의 반환 값으로 새로운 배열을 반환한다.

 

// 숫자 배열 예제

const numbers = [2, 3, 4];

const addTwo = numbers.map(function(number) {
	return number + 2;
});
console.log(addTwo); // 결과: [3, 4, 5];

 

 

// 문자 배열 예제

const names = ["sam", "tom"];
const upperNames = names.map(function(name) {
    return name.toUpperCase();
});

console.log(upperNames); // 결과: ["SAM", "TOM"]


// 만약 callback function안에 return을 깜빡한다면 [undefined, undefined]를 반환합니다.
// 그 이유는, 원래 배열인 ["sam", "tom"]에서 각각의 element에 undefined를 반환하기 때문입니다.

 

// 화살표 함수를 이용한 예제

const array = [ 1, 2, 3];
const map = array.map(x=> x * 2);
console.log(map); // 결과: [2, 4, 6];

 

.includes(item)

---

takes item rather than a call back 

true 또는 false를 반환합니다.

 

// includes를 사용한 예제

const fruit = ["Banana", "Apple", "Grape"];

fruit.includes("Apple"); // true
fruit.includes("Jam"); // false

 

 

.toString()

---

자동으로 fruit의 배열을 하나의 문자열로 반환한다.

 

// 예제

const fruit = ["Banana", "Apple", "Grape"];
fruit.toString(); // "Banana, Apple, Grape"

 

.join()

---

배열을 문자열로 반환할 때 배열들을 합칠 때 조건을 추가할 수 있다.

 

// 예제

const fruit = ["Banana", "Apple", "Grape"];
fruit.join("; "); // "Banana; Apple; Grape"
fruit.join(" . "); // "Banana . Apple . Grape"

 

 

 

See the Pen Untitled by heerachoi (@heerachoi) on CodePen.

 

 

 

 

 

 

Reference

Array.prototype.map() - JavaScript | MDN

Array.prototype.includes() - JavaScript | MDN