JS中的数组

ihcx2554 5年前
   <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>