Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Commit facf332

Browse files
authored
Array Manipulation Functions
1 parent 78f1f17 commit facf332

File tree

1 file changed

+84
-0
lines changed

1 file changed

+84
-0
lines changed

‎README.md

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -113,3 +113,87 @@ const weightsInPounds = [5, 15.4, 9.8, 110];
113113
// with currying
114114
const weightsInKg = weightsInPounds.map(poundsToKg); // 2.27kg, 7.00kg, 4.46kg, 50.01kg
115115
```
116+
117+
## Array Manipulation Functions
118+
119+
Array Functions are the gateway to functional programming in JavaScript. These functions make short work of most imperative programming routines that work on arrays and collections.
120+
121+
***[].every(fn)***
122+
123+
Checks if all elements in an array pass a test.
124+
125+
***[].some(fn) | [].includes(fn)***
126+
127+
Checks if any of the elements in an array pass a test.
128+
129+
***[].find(fn)***
130+
131+
Returns the value of the first element in the array that passes a test.
132+
133+
***[].filter(fn)***
134+
135+
Creates an array filled with only the array elements that pass a test.
136+
137+
***[].map(fn)***
138+
139+
Creates a new array with the results of a function applied to every element in the array.
140+
141+
***[].reduce(fn(accumulator, currentValue))***
142+
143+
Executes a provided function for each value of the array (from left-to-right). Returns a single value, the accumulator.
144+
145+
***[].sort(fn(a,b))*** warning, mutates state!
146+
147+
Modifies an array by sorting the items within an array. An optional compare function can be used to customize sort behavior. Use the spread operator to avoid mutation. [...arr].sort()
148+
149+
***[].reverse()*** warning, mutates state!
150+
151+
Reverses the order of the elements in an array. Use the spread operator to avoid mutation. [...arr] . reverse()
152+
153+
For example:
154+
155+
```javascript
156+
const names = [
157+
{text: "Alpha", value: 5},
158+
{text: "Beta", value: 2},
159+
{text: "Gamma", value: 4},
160+
];
161+
162+
//Checks if all elements in an array pass a test.
163+
let everyResult = names.every(x => x.value > 0); //true
164+
165+
// Checks if any of the elements in an array pass a test.
166+
let someResult = names.some(x => x.text === "Alpha"); //true
167+
168+
// Returns the value of the first element in the array that passes a test.
169+
let findResult = names.find(x => x.text === "Gamma"); //{text: "Gamma", value: 4}
170+
171+
// Creates an array filled with only the array elements that pass a test.
172+
let filterResult = names.filter(x => x.value > 3); //[{text: "Alpha", value: 5}, {text: "Gamma", value: 4}]
173+
174+
// Creates a new array with the results of a function applied to every element in the array.
175+
let mapResult = names.map(x => ({...x, value: x.value *10}));
176+
//[{text: "Alpha", value: 50}, {text: "Beta", value: 20}, {text: "Gamma", value: 40}];
177+
178+
// Executes a provided function for each value of the array (from left-to-right). The returns a single value, the accumulator.
179+
let reduceResult = names.reduce((accumulator, currentValue) => currentValue.value > accumulator.value ? currentValue : accumulator);
180+
// Get the largest object by value: {"text":"Alpha","value":5}
181+
182+
// Modifies an array by sorting the items within an array. An optional compare function can be used to customize sort behavior. Use the spread operator to avoid mutation. [...arr].sort()
183+
let sortResult = [...names].sort((a,b) => b.value - a.value);
184+
185+
// reverses the order of the elements in an array. Use the spread operator to avoid mutation. [...arr].reverse()
186+
let reverseResult = [...names].reverse();
187+
188+
// Results
189+
const appDiv = document.getElementById('app');
190+
appDiv.innerHTML = `
191+
<p>every: ${everyResult}</p>
192+
<p>some: ${someResult}</p>
193+
<p>find: ${JSON.stringify(findResult)}</p>
194+
<p>filter: ${JSON.stringify(filterResult)}</p>
195+
<p>map: ${JSON.stringify(mapResult)}</p>
196+
<p>reduce: ${JSON.stringify(reduceResult)}</p>
197+
<p>reverse: ${JSON.stringify(reverseResult)}</p>
198+
<p>sort: ${JSON.stringify(sortResult)}</p>`;
199+
```

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /