Skip to main content

map()

map<T, Result>(collection, iteratee): Result[]

map<T, Result>(collection, iteratee): Result[]

Creates an array of values by running each element in collection thru iteratee.

DEPRECATED

Use array.map() or Object.entries().map() directly instead.

Type Parameters​

T: T​

The type of elements in the array, or the object type.

Result: Result​

The type of the mapped result.

Parameters​

Overload 1:

collection: T[]​

The collection to iterate over.

iteratee: (value, index, array) => Result​

The function invoked per iteration.

Overload 2:

collection: T​

The collection to iterate over.

iteratee: (value, key, object) => Result​

The function invoked per iteration.

Returns: Result[]​

The new mapped array.

See Also​

Since​

2.0.0

Also known as​

map (Lodash, es-toolkit, Remeda, Ramda, Effect) · ❌ (Radashi, Modern Dash, Antfu)

Example​

const numbers = [1, 2, 3, 4, 5];

// ❌ Deprecated approach
const doubled = map(numbers, n => n * 2);
console.log(doubled); // [2, 4, 6, 8, 10]

// ✅ Recommended approach (for arrays)
const doubledNative = numbers.map(n => n * 2);
console.log(doubledNative); // [2, 4, 6, 8, 10]

// ✅ Recommended approach (for objects)
const obj = { a: 1, b: 2, c: 3 };
const doubledObj = Object.entries(obj).map(([key, value]) => [key, value * 2]);
console.log(doubledObj); // [['a', 2], ['b', 4], ['c', 6]]

How it works?​

Creates an array by running each element through iteratee. Deprecated: Use array.map() directly.

Native Equivalent​

// ❌ map(arr, fn)
// ✅ arr.map(fn)

Use Cases​

Transform collection elements 📌​

Apply a function to each element.

const users = [{ name: "Alice" }, { name: "Bob" }];
users.map(u => u.name.toUpperCase());
// => ["ALICE", "BOB"]

Convert object values​

Transform all values in an object.

const prices = { apple: 1.5, banana: 0.75 };
Object.fromEntries(
  Object.entries(prices).map(([k, v]) => [k, v * 1.1])
);
// => { apple: 1.65, banana: 0.825 }

Extract property values​

Get a specific property from each object.

const items = [{ id: 1 }, { id: 2 }, { id: 3 }];
items.map(item => item.id);
// => [1, 2, 3]

Format data for display​

Transform raw data into human-readable strings for UI rendering. The most common real-world use of map in frontend applications.

const transactions = [
  { amount: 1299, currency: "USD", date: "2025-06-15T10:30:00Z" },
  { amount: 4599, currency: "EUR", date: "2025-06-14T08:00:00Z" },
];

const formatted = map(transactions, (t) => ({
  display: `${(t.amount / 100).toFixed(2)} ${t.currency}`,
  date: new Date(t.date).toLocaleDateString("fr-FR"),
}));
// => [{ display: "12.99 USD", date: "15/06/2025" }, { display: "45.99 EUR", date: "14/06/2025" }]