数据结构 – 数组

1.数组结构

  • JavaScript中创建和初始化数组:
1
2
var daysOfWeek = ['Sunday', 'Monday', 'Tuesday', 'Wednesday',
'Thursday', 'Friday', 'Saturday'];
  • 获取数组长度
1
alert(daysOfweek.length)
  • // 普通for方式遍历数组
    for (var i = 0; i < daysOfWeek.length; i++) {
        alert(daysOfWeek[i])
    }
    
    // 通过foreach遍历数组
    daysOfWeek.forEach(function (value) {
        alert(value)
    })
    <!--hexoPostRenderEscape:<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">* 数组的增删改查</span><br><span class="line"></span><br><span class="line">&#96;&#96;&#96;javascript</span><br><span class="line">&#x2F;&#x2F; 添加一个元素到数组的最后位置</span><br><span class="line">&#x2F;&#x2F; 方式一:</span><br><span class="line">numbers[numbers.length] &#x3D; 10</span><br><span class="line"></span><br><span class="line">&#x2F;&#x2F; 方式二:</span><br><span class="line">numbers.push(11)</span><br><span class="line">numbers.push(12, 13)</span><br><span class="line"></span><br><span class="line">alert(numbers)</span><br></pre></td></tr></table></figure>:hexoPostRenderEscape-->
    
1
2
3
4
5
6
7
8
9
10
// 在数组首位插入一个元素
for (var i = numbers.length; i > 0; i--) {
numbers[i] = numbers[i-1]
}
numbers[0] = -1
alert(numbers) // -1,0,1,2,3,4,5,6,7,8,9,10,11,12,13
// 通过unshift在首位插入数据
numbers.unshift(-2)
numbers.unshift(-4, -3)
alert(numbers) // -4,-3,-2,-1,0,1,2,3,4,5,6,7,8,9,10,11,12,13
1
2
3
4
5
6
// 删除最后的元素
numbers.pop()
alert(numbers) // -4,-3,-2,-1,0,1,2,3,4,5,6,7,8,9,10,11,12
//移除的首位元素
numbers.shift()
alert(numbers)

通过splice删除数据

1
2
3
// 删除指定位置的几个元素
numbers.splice(5, 3)
alert(numbers) // -4,-3,-2,-1,0,4,5,6,7,8,9,10,11,12,13

使用splice来插入数据

1
2
3
// 插入指定位置元素
numbers.splice(5, 0, 3, 2, 1)
alert(numbers) // -4,-3,-2,-1,0,3,2,1,4,5,6,7,8,9,10,11,12,13

使用splice修改数据

1
2
3
// 修改指定位置的元素
numbers.splice(5, 3, "a", "b", "c")
alert(numbers) // -4,-3,-2,-1,0,a,b,c,4,5,6,7,8,9,10,11,12,13

splice(起始位置[,删除元素个数[,插入的元素[,插入的第N个元素]]])

  • 数组合并

1
2
3
4
5
6
7
8
// 数组的合并
var nums1 = [1, 2, 3]
var nums2 = [100, 200, 300]
var newNums = nums1.concat(nums2)
alert(newNums) // 1,2,3,100,200,300

newNums = nums1 + nums2
alert(newNums) // 1,2,3,100,200,300
  • 迭代方法

    • every()

      • 判断一组元素中是否都包含某一个字符

      • let name=['abc','adc','amn','azq']
        let f = name.every(function(t){
            return t.indexOf('a')!=-1
        })
        console.log(f)
        <!--hexoPostRenderEscape:<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">* filter()方法</span><br><span class="line"></span><br><span class="line">  * 是一种过滤函数  遍历数组中每一个元素 传入到这个函数中, 如果返回true 那么找到的这个元素回被添加到最新的数组中  若返回false 那么忽略   </span><br><span class="line"></span><br><span class="line">  * 最后会创建一个新的数组  新的数组中的元素是通过检查指定数组中符合条件的所有元素。</span><br><span class="line"></span><br><span class="line">  * &#96;&#96;&#96;javascript</span><br><span class="line">    &#x2F;&#x2F;代码实现</span><br><span class="line">    let name &#x3D; [&#39;hyp&#39;,&#39;zyp&#39;,&#39;ypq&#39;,&#39;ymm&#39;]</span><br><span class="line">    let fname&#x3D; name.filter(function(g)&#123;</span><br><span class="line">        return g.indexOf(&quot;m&quot;)!&#x3D;-1</span><br><span class="line">    &#125;)</span><br><span class="line">    console.log(fname)</span><br></pre></td></tr></table></figure>:hexoPostRenderEscape-->
    • map()

      • 映射函数 先将数组中每一个元素遍历 元素经过指令变换 生成新的元素 返回新的元素后会将返回的所有元素形成一个新的数组

      • let name = ['hy','tt','zz']
        let newname = name.map(function(t){
            return t + 'p'
        })
        console.log(newname)
        <!--hexoPostRenderEscape:<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">* reduce()</span><br><span class="line"></span><br><span class="line">  * 参数</span><br><span class="line"></span><br><span class="line">    - callback(一个在数组中每一项上调用的函数,接受四个函数:)</span><br><span class="line">      - previousValue(上一次调用回调函数时的返回值,或者初始值)</span><br><span class="line">      - currentValue(当前正在处理的数组元素)</span><br><span class="line">      - currentIndex(当前正在处理的数组元素下标)</span><br><span class="line">      - array(调用reduce()方法的数组)</span><br><span class="line">    - initialValue(可选的初始值。作为第一次调用回调函数时传给previousValue的值)</span><br><span class="line"></span><br><span class="line">    &#96;&#96;&#96;javascript</span><br><span class="line">    &#x2F;&#x2F; 使用reduce方法实现类加求和</span><br><span class="line">    var total &#x3D; numbers.reduce(function (pre, cur) &#123;</span><br><span class="line">        return pre + cur</span><br><span class="line">    &#125;)</span><br><span class="line">    alert(total)</span><br></pre></td></tr></table></figure>:hexoPostRenderEscape-->