[JavaScript] ES10 - flat/flatMap, Object.fromEntries, trimStart/trimEnd

 

1. flat / flatMap

Array.prototype.flat(n)

: 중첩된 배열을 펼쳐서 1차원 배열로 만든다. 

- n이 빈값이면 기본적으로 1단계만 펼침

- n단계까지 펼치고,

- 특정 숫자를 지정하기 어려울 때 Intinity 를 넣으면 배열의 depth 와 관계없이 1차원 배열로 만든다.

const array = [[1],[2],[3],[[[4]]],[[[5]]]]
console.log(array.flat(2))	// [1,2,3,[4],[5]]

const trapped = [[[[[[[[[[[[[[[[[[[[[[[[[[3]]]]]]]]]]]]]]]]]]]]]]]]]];
console.log(trapped.flat(Infinity))		// [3]

 

Array.prototype.flatMap()

: map()을 적용한 후, 결과를 flat() 한다.

const greeting = [["Hello", "young", "grasshopper!"], ["you", "are"], ["learning", "fast!"]];

// [ 'Hello young grasshopper!', 'you are', 'learning fast!' ]
console.log(greeting.flatMap(x => x.join(' ')))	

// 'Hello young grasshopper you are learning fast!'
console.log(greeting.flatMap(x => x.join(' ')).join(' '))

const arr = [1, 2, 3];

// [1, 2, 2, 4, 3, 6]  (각 요소를 2배로 늘리고 펼침)
console.log(arr.flatMap(num => [num, num * 2]));

 

 

2. Object.fromEntries

: 배열을 객체로 변환한다.

: Object.entries() 의 반대역할.

const users = { user1: 18273, user2: 92833, user3: 90315 }

// 객체->배열 [ [ 'user1', 18273 ], [ 'user2', 92833 ], [ 'user3', 90315 ] ]
const usersArray = Object.entries(users)

// [ [ 'user1', 36546 ], [ 'user2', 185666 ], [ 'user3', 180630 ] ]
updatedUsersArray = usersArray.map((user) => [user[0], user[1] * 2])

// 배열->객체 { user1: 36546, user2: 185666, user3: 180630 }
const updatedUsers = Object.fromEntries(updatedUsersArray)

 

 

3. trimStart / trimEnd

String.prototype.trimStart()

String.prototype.trimEnd()

: 앞뒤 공백을 제거하는 trim()의 확장

const userEmail3 = '     HELLO   '

console.log(userEmail3.trim())		// 앞뒤 공백 제거	'HELLO'
console.log(userEmail3.trimStart())	// 앞 공백 제거	'HELLO   '
console.log(userEmail3.trimEnd())	// 뒤 공백 제거	'     HELLO'