JS中的数组
ihcx2554
9年前
<p>JS中的数组和其他语言不同的是一个数组可以保存多个类型的值，比如数组中第一个位置保存一个字符类型的值，第二个可以保存数值型的值，第三个则可以保存一个对象。</p> <p>声明方式：</p> <pre> <code class="language-javascript">var color = new Array(); var color = new Array(20); var color = new Array("red","blue","green"); </code></pre> <p>另外数组中的length属性不是只读的，可以通过这个属性设置数组的长度。</p> <p>例如：</p> <pre> <code class="language-javascript">var color = new Array("red","blue","green"); color[color.length]="black"; //在位置3添加一种颜色 color[color.length]="brown";//在位置4添加一种颜色 </code></pre> <p>这样依次在最后的位置添加元素，对于跨长度添加也是可以的，例如在100的位置添加一个元素，但这个区间没有赋值的元素都会为undefined</p> <h3>检测对象是否为数组</h3> <pre> <code class="language-javascript">if (Array.isArray(value)) { } </code></pre> <h3>数组的tostring()、valueOf()、join()方法</h3> <p>这些方法会将数组内每项元素用逗号分隔开</p> <pre> <code class="language-javascript">color.toString(); //red,blue,green color.valueOf();//red,blue,green color.join("|"); //red|blue|green Join方法，表示用哪种符号分隔数组元素 </code></pre> <p>另外，需要注意如果数组中的元素存在undefined或null时，则上面的方法返回的是空字符串。</p> <h3>Push、pop、shift方法</h3> <pre> <code class="language-javascript">color.push("white", "org") ; </code></pre> <p>在数组末尾添加两个元素，push里的数量不固定，可随意,另外这个方法有一个返回值，这个返回值，是数组的length</p> <pre> <code class="language-javascript">color.pop(); </code></pre> <p>获取数组的最后一个元素。</p> <pre> <code class="language-javascript">color.shift() </code></pre> <p>获取第一项，并移除第一项</p> <h3>排序</h3> <p>数组中提供了两个默认的排序方法，分别是reverse()和sort()</p> <pre> <code class="language-javascript">var values=[0,1,5,10,15] </code></pre> <p>reverse()方法是反转数组的顺序，按数组的下标倒序显示。values.reverse() //15,10,5,1,0</p> <p>sort()方法是将内部的值进行tostring后进行排序。values.sort() //0,1,10,15,5</p> <p>显然上面的排序是有错误的，因为比较的是字符串类型的所以会认为5比1大。</p> <p>如果想得到正确的结果，可以向这个方法传递一个比较函数作为参数。</p> <p>比较函数接收两个参数，如果第一个参数应该位于第二个之前，则返回一个负数，如果相等，则返回0，如果第一个位于第二之后，则返回正数，例如：</p> <pre> <code class="language-javascript"> function compare(value1, value2) { if (value1 < value2) { return -1 } else if (value1 > value2) { return 1; } else { return 0; } } </code></pre> <pre> <code class="language-javascript">values.sort(compare); </code></pre> <p>这样就可以正确排序了。如果逆序的话，则适当修改返回值，就可以。</p> <p>如果只是数值类型的比较，则代码更为简单。</p> <pre> <code class="language-javascript"> function compare(value1,value2){ return value1-value2 } </code></pre> <h3>concat、slice 方法</h3> <p>concat方法可以进行数组之间的连接，也可添加新元素</p> <pre> <code class="language-javascript">var colors = ["red", "green", "blue"]; var colors2 = colors.concat("yellow", ["black", "brown"]); //red,green,blue,yellow,black,brown </code></pre> <p>slice方法接收两个参数，起始位置和操作的个数，他可以进行删除、插入、替换，slice始终都会返回一个数组，该数组包含从原始数组中删除的项，如果没有任何项，则返回一个空数组。</p> <pre> <code class="language-javascript">var colors = ["red", "green", "blue"]; var removed = colors.splice(0, 1); //删除第一项,并red var removed = colors.splice(1, 0, "yellow", "orange");//从第一个位置插入两项,返回空 var removed = colors.splice(1, 1, "red", "purple"); //删除第二项，插入两项，返回blue </code></pre> <h3>位置方法 indexOf和lastIndexOf</h3> <p>这两个方法都接收两个参数，分别是要查找的项和查找的起点位置。</p> <pre> <code class="language-javascript">var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]; numbers.indexOf(4); //返回3 numbers.lastIndexOf(4) //返回5 从末尾开始查找 </code></pre> <p>如果这两个方法没有找到搜索项，则返回-1。</p> <h3>迭代方法</h3> <pre> <code class="language-javascript">var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]; </code></pre> <p>every() <strong>：</strong> <strong>如果该函数的每一项都返回true</strong> <strong>，则返回true</strong></p> <pre> <code class="language-javascript">var everyResult = numbers.every(function (item, index, array) { return (item > 2); }); //返回false </code></pre> <p>filter() : <strong>返回函数中满足条件的元素组成的数组。</strong></p> <pre> <code class="language-javascript">var filterResult = numbers.filter(function (item, index, array) { return (item > 2); }); // 返回 [3,4,5,4,3] </code></pre> <p>forEach() : <strong>循环遍历数组，这个方法没有返回值。</strong></p> <pre> <code class="language-javascript">numbers.forEach(function (item, index, array) { //执行某些操作。 }); </code></pre> <p>map() : <strong>返回每次调用的结果组成的数组。</strong></p> <pre> <code class="language-javascript">var mapResult = numbers.map(function (item, index, array) { return (item * 2); }); //[2,4,6,8,10,8,6,4,2] </code></pre> <p>some() : <strong>如果函数中，有任意一项返回true</strong> <strong>，则返回true</strong> <strong>。</strong></p> <pre> <code class="language-javascript">var someResult = number.some(function (item, index, array) { return (item > 2); }); //true </code></pre> <h3>归并方法</h3> <p>归并方法有reduce()和reduceRight()两个方法，reduce是数组的第一项开始遍历到最后，reduceRight是从最后一项开始，遍历到第一项。</p> <p>这两个函数分别接受4个参数：前一个值，当前值，项的索引和数组对象。</p> <pre> <code class="language-javascript"> var values=[1,2,3,4,5] var sum = values.reduce(function (prev, cur, index, array) { return prev + cur; }); //返回15 </code></pre> <p>来自： <a href="/misc/goto?guid=4959670292107735933" rel="nofollow">http://www.cnblogs.com/y8932809/p/5381665.html</a> </p>