Skip to content

Commit bb79353

Browse files
Markus Amalthea Magnusonajpiano
Markus Amalthea Magnuson
authored andcommitted
Various small fixes on the JavaScript 101 Arrays page. Fixes jquery#352.
1 parent 41b1d05 commit bb79353

File tree

1 file changed

+49
-39
lines changed

1 file changed

+49
-39
lines changed

page/javascript-101/arrays.md

Lines changed: 49 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -5,13 +5,15 @@ source: http://jqfundamentals.com/legacy
55
attribution:
66
- jQuery Fundamentals
77
---
8+
89
Arrays are zero-indexed, ordered lists of values. They are a handy way to store a set of related items of the same type (such as strings), though in reality, an array can include multiple types of items, including other arrays.
910

1011
To create an array, either use the object constructor or the literal declaration, by assigning the variable a list of values after the declaration.
1112

1213
```
1314
// A simple array with constructor.
1415
var myArray1 = new Array( "hello", "world" );
16+
1517
// Literal declaration, the preferred way.
1618
var myArray2 = [ "hello", "world" ];
1719
```
@@ -22,22 +24,24 @@ If the values are unknown, it is also possible to declare an empty array, and ad
2224

2325
```
2426
// Creating empty arrays and adding values
27+
2528
var myArray = [];
2629
27-
// adds "hello" on index 0
30+
// Adds "hello" on index 0
2831
myArray.push( "hello" );
2932
30-
// adds "world" on index 1
33+
// Adds "world" on index 1
3134
myArray.push( "world" );
3235
33-
// adds "!" on index 2
36+
// Adds "!" on index 2
3437
myArray[ 2 ] = "!";
3538
```
3639

3740
`.push()` is a function that adds an element on the end of the array and expands the array respectively. You also can directly add items by index. Missing indices will be filled with `undefined`.
3841

3942
```
4043
// Leaving indices
44+
4145
var myArray = [];
4246
4347
myArray[ 0 ] = "hello";
@@ -51,9 +55,10 @@ If the size of the array is unknown, `.push()` is far more safe. You can both ac
5155

5256
```
5357
// Accessing array items by index
58+
5459
var myArray = [ "hello", "world", "!" ];
5560
56-
console.log( myArray[2] ); // "!"
61+
console.log( myArray[ 2 ] ); // "!"
5762
```
5863

5964
## Array Methods and Properties
@@ -64,6 +69,7 @@ The `.length` property is used to determine the amount of items in an array.
6469

6570
```
6671
// Length of an array
72+
6773
var myArray = [ "hello", "world", "!" ];
6874
6975
console.log( myArray.length ); // 3
@@ -73,21 +79,27 @@ You will need the `.length` property for looping through an array:
7379

7480
```
7581
// For loops and arrays - a classic
82+
7683
var myArray = [ "hello", "world", "!" ];
7784
7885
for ( var i = 0; i < myArray.length; i = i + 1 ) {
79-
console.log( myArray[i] );
86+
87+
console.log( myArray[ i ] );
88+
8089
}
8190
```
8291

8392
Except when using `for`/`in` loops:
8493

8594
```
8695
// For loops and arrays - alternate method
96+
8797
var myArray = [ "hello", "world", "!" ];
8898
8999
for ( var i in myArray ) {
100+
90101
console.log( myArray[ i ] );
102+
91103
}
92104
```
93105

@@ -96,31 +108,29 @@ for ( var i in myArray ) {
96108
Concatenate two or more arrays with `.concat()`:
97109

98110
```
99-
// Concatenating Arrays
100111
var myArray = [ 2, 3, 4 ];
101112
var myOtherArray = [ 5, 6, 7 ];
102-
103-
// [ 2, 3, 4, 5, 6, 7 ]
104-
var wholeArray = myArray.concat( myOtherArray );
113+
var wholeArray = myArray.concat( myOtherArray ); // [ 2, 3, 4, 5, 6, 7 ]
105114
```
106115

107116
### .join()
108117

109-
`.join()` creates a string representation of an array by joining all of its elements using a separator string. If no separator is supplied (e.g. `.join()` is called without arguments) the array will be joined using a comma:
118+
`.join()` creates a string representation of an array by joining all of its elements using a separator string. If no separator is supplied (e.g. `.join()` is called without arguments) the array will be joined using a comma.
110119

111120
```
112121
// Joining elements
122+
113123
var myArray = [ "hello", "world", "!" ];
114124
115-
// The default separator is a comma
125+
// The default separator is a comma.
116126
console.log( myArray.join() ); // "hello,world,!"
117127
118128
// Any string can be used as separator...
119-
console.log( myArray.join(" ") ); // "hello world !";
120-
console.log( myArray.join("!!") ); // "hello!!world!!!";
129+
console.log( myArray.join( " " ) ); // "hello world !";
130+
console.log( myArray.join( "!!" ) ); // "hello!!world!!!";
121131
122-
// ...including an empty one
123-
console.log( myArray.join("") ); // "helloworld!"
132+
// ...including an empty one.
133+
console.log( myArray.join( "" ) ); // "helloworld!"
124134
125135
```
126136

@@ -129,7 +139,8 @@ console.log( myArray.join("") ); // "helloworld!"
129139
`.pop()` removes the last element of an array. It is the opposite method of `.push()`:
130140

131141
```
132-
// pushing and popping
142+
// Pushing and popping
143+
133144
var myArray = [];
134145
135146
myArray.push( 0 ); // [ 0 ]
@@ -143,19 +154,17 @@ myArray.pop(); // [ 0 , 2 ]
143154
As the name suggests, the elements of the array are in reverse order after calling this method:
144155

145156
```
146-
// reverse
147157
var myArray = [ "world" , "hello" ];
148-
149-
// [ "hello", "world" ]
150-
myArray.reverse();
158+
myArray.reverse(); // [ "hello", "world" ]
151159
```
152160

153161
### .shift()
154162

155-
Removes the first element of an array. With `.push()` and `.shift()`, you can recreate the method of a [queue](http://en.wikipedia.org/wiki/Queue_(data_structure)):
163+
Removes the first element of an array. With `.push()` and `.shift()`, you can recreate the method of a [queue](http://en.wikipedia.org/wiki/Queue_(abstract_data_type%29):
156164

157165
```
158-
// queue with shift() and push()
166+
// Queue with shift() and push()
167+
159168
var myArray = [];
160169
161170
myArray.push( 0 ); // [ 0 ]
@@ -169,7 +178,8 @@ myArray.shift(); // [ 2 , 7 ]
169178
Extracts a part of the array and returns that part in a new array. This method takes one parameter, which is the starting index:
170179

171180
```
172-
// slicing
181+
// Slicing
182+
173183
var myArray = [ 1, 2, 3, 4, 5, 6, 7, 8 ];
174184
var newArray = myArray.slice( 3 );
175185
@@ -182,18 +192,16 @@ console.log( newArray ); // [ 4, 5, 6, 7, 8 ]
182192
Removes a certain amount of elements and adds new ones at the given index. It takes at least three parameters:
183193

184194
```
185-
// splice method
186195
myArray.splice( index, length, values, ... );
187196
```
188197

189-
* *Index* - The starting index.
190-
* *Length* - The number of elements to remove.
191-
* *Values* - The values to be inserted at the Index position.
198+
* *Index* The starting index.
199+
* *Length* The number of elements to remove.
200+
* *Values* The values to be inserted at the index position.
192201

193202
For example:
194203

195204
```
196-
// splice example
197205
var myArray = [ 0, 7, 8, 5 ];
198206
myArray.splice( 1, 2, 1, 2, 3, 4 );
199207
@@ -205,14 +213,16 @@ console.log( myArray ); // [ 0, 1, 2, 3, 4, 5 ]
205213
Sorts an array. It takes one parameter, which is a comparing function. If this function is not given, the array is sorted ascending:
206214

207215
```
208-
// sorting without comparing function
216+
// Sorting without comparing function.
217+
209218
var myArray = [ 3, 4, 6, 1 ];
210219
211220
myArray.sort(); // 1, 3, 4, 6
212221
```
213222

214223
```
215-
// sorting with comparing function
224+
// Sorting with comparing function.
225+
216226
function descending( a, b ) {
217227
return b - a;
218228
}
@@ -222,14 +232,13 @@ var myArray = [ 3, 4, 6, 1 ];
222232
myArray.sort( descending ); // [ 6, 4, 3, 1 ]
223233
```
224234

225-
The return value of descending (for this example) is important. If the return value is less than zero, the index of a is before b, and if it is greater than zero it's vice-versa. If the return value is zero, the elements index is equal.
235+
The return value of descending (for this example) is important. If the return value is less than zero, the index of `a` is before `b`, and if it is greater than zero it's vice-versa. If the return value is zero, the elements' index is equal.
226236

227237
### .unshift()
228238

229239
Inserts an element at the first position of the array:
230240

231241
```
232-
// unshift
233242
var myArray = [];
234243
235244
myArray.unshift( 0 ); // [ 0 ]
@@ -243,14 +252,15 @@ In modern browsers it is possible to traverse through arrays with a `.forEach()`
243252

244253
The function takes up to three arguments:
245254

246-
* *Element* - The element itself.
247-
* *Index* - The index of this element in the array.
248-
* *Array* - The array itself.
255+
* *Element* The element itself.
256+
* *Index* The index of this element in the array.
257+
* *Array* The array itself.
249258

250-
All of these are optional, but you will need at least the "Element" parameter in most cases.
259+
All of these are optional, but you will need at least the *Element* parameter in most cases.
251260

252261
```
253-
// native forEach
262+
// Native .forEach()
263+
254264
function printElement( elem ) {
255265
console.log( elem );
256266
}
@@ -265,10 +275,10 @@ function negateElement( elem, index, array ) {
265275
266276
myArray = [ 1, 2, 3, 4, 5 ];
267277
268-
// prints all elements to the console
278+
// Prints all elements to the console
269279
myArray.forEach( printElement );
270280
271-
// prints "Index 0: 1" "Index 1: 2" "Index 2: 3" ...
281+
// Prints "Index 0: 1", "Index 1: 2", "Index 2: 3", ...
272282
myArray.forEach( printElementAndIndex );
273283
274284
// myArray is now [ -1, -2, -3, -4, -5 ]

0 commit comments

Comments
 (0)