Essential Books

Mapping values

suggest change

It is often necessary to generate a new array based on the values of an existing array.

For example, to generate an array of string lengths from an array of strings: 

['one', 'two', 'three', 'four'].map(function(value, index, arr) {
  return value.length;
});
// → [3, 3, 5, 4]

['one', 'two', 'three', 'four'].map(value => value.length);
// → [3, 3, 5, 4]

In this example, an anonymous function is provided to the map() function, and the map function will call it for every element in the array, providing the following parameters, in this order:

Additionally, map() provides an optional second parameter in order to set the value of this in the mapping function. Depending on the execution environment, the default value of this might vary:

In a browser, the default value of this is always window: 

['one', 'two'].map(function(value, index, arr) {
  console.log(this); // window (the default value in browsers)
  return value.length;
});

You can change it to any custom object like this: 

['one', 'two'].map(function(value, index, arr) {
  console.log(this); // Object { documentation: "randomObject" }
  return value.length;
}, {
  documentation: 'randomObject'
});
Found a mistake? Have a question or improvement idea? Let me know.

Feedback about page:

Feedback:
Optional: your email if you want me to get back to you:

Arrays:
* Syntax
* Remarks
* Converting Array-like Objects to Arrays
* Reducing values
* Mapping values
* Filtering Object Arrays
* Sorting Arrays
* Iteration
* Removing duplicate elements
* Destructuring an array
* Array comparison
* Reversing arrays
* Concatenating Arrays
* Shallow cloning an array
* Merge two array as key value pair
* Array spread rest
* Finding the minimum or maximum element
* Removing items from an array
* Filtering values
* Standard array initialization
* Removing all elements
* Searching an Array
* Convert a String to an Array
* Joining array elements in a string
* Removing / adding elements using splice
* The entries() method
* Remove value from array
* Logical connective of values
* Flattening Arrays
* Object keys and values to array
* Append / prepend items to array
* Checking if an object is an array
* Sorting multidimensional array
* Insert an item into an array at a specific index
* Test all array items for equality
* Copy part of an array with slice()
* Using map to reformat objects in an array
Table Of Contents
0 Getting started
1 Comments
2 Basic data types
3 Built-in constants
4 Variables
5 Declarations and assignments
6 Reserved keywords
7 Data types in JavaScript
8 Strings
9 Escape sequences
10 Template Literals
11 Arrays
12 Objects
13 Prototypes objects
14 Classes
15 Variable coercion / conversion
16 Map
17 Set
18 Arithmetic Math
19 Bitwise operators
20 Bitwise operators
21 Unary Operators
22 Comparison operations
23 Conditions
24 Loops
25 Functions
26 Arrow functions
27 Date
28 Date comparison
29 Scope
30 AJAX
31 Promises
32 Regular Expression
33 Error Handling
34 Geolocation
35 Cookies
36 Intervals and timeouts
37 Generators
38 History of visited urls
39 Strict mode
40 Custom Elements
41 JSON
42 Binary Data
43 Web Storage
44 Fetch
45 Modules
46 Screen
47 Inheritance
48 Timestamps
49 Destructuring assignment
50 Web Worker
51 Debugging
52 Notifications API
53 WebSockets
54 Web Cryptography API
55 Async functions, async / await
56 Constructor functions
57 execCommand and contenteditable
58 Performance Tips
59 Design patterns
60 requestAnimationFrame
61 Method chaining
62 Global error handling in browsers
63 File API, blobs and FileReaders
64 Console
65 Tail call optimization
66 Detecting browser
67 Enumerations
68 Symbols
69 Localization
70 Selection API
71 Callbacks
72 Functional JavaScript
73 Modals
74 Data attributes
75 Event Loop
76 Events
77 Data manipulation
78 BOM Browser Object Model
79 Unit Testing
80 Linters for ensuring code quality
81 Automatic Semicolon Insertion
82 IndexedDB
83 Anti-patterns
84 Navigator Object
85 Modularization techniques
86 Proxy
87 Same origin policy, cross-origin communication
88 postMessage and MessageEvent
89 WeakMap
90 WeakSet
91 Behaviroal Design Patterns
92 Server-sent events
93 Async iterators
94 Namespacing
95 Evaluating JavaScript
96 Memory efficiency
97 How to make iterator usable inside async callback function
98 Context this
99 Setters and getters
100 Vibration API
101 Fluent API
102 Tilde
103 Security issues
104 Get and set CSS custom variables
105 Contributors