zoukankan      html  css  js  c++  java
  • 【template的{{each }}】,【jQuery的each】,【EcmaScript 5的forEach】

    1. 区别
    1. each 是 art-template 的模板语法,专属的只能在模板字符串中使用
      {{each 数组}}
      <li>{{ $value }}</li>
      {{/each}}
    
    
    2. jQuery的 each,一般用于遍历 jQuery 选择器选择到的伪数组实例对象
      $.each(数组, function)
      $('div').each(function) 
    
      # 使用场景,$('div')是伪数组是对象,伪数组是对象,对象的原型链中没有 forEach, 对象的原型链是 Object.prototype
        1. 方便的遍历 jQuery 元素
        2. 可以在不兼容 forEach 的低版本浏览器中使用 jQuery 的 each 方法
    
      # 代替方法:  
        ;[].slice.call($('div')).forEach(function (item) {console.log(item)})
          1. slice(start,end)接受两个参数,start和end是将一个数组从start项开始截取到end项但不包含end项
          2. call(thisArg,arg1, arg2, ...)thisArg代表当前函数执行时this的指向,args为函数的参数(
    
    
    3. forEach 
      forEach 是 EcmaScript 5 中的一个数组遍历函数,是 JavaScript 原生支持的遍历方法 可以遍历任何可以被遍历的成员,由于是 EcmaScript 5 中的,所以低版本浏览器不支持
      jQuery 的 each 方法和 forEach 几乎一致
    
    
    1. 伪数组概念
    # 1.
    var obj = {
        0: 'a',
        1: 'b',
        2: 'c',
        length: 3
    }
      
    ;[].push.call(obj, 'd')
    console.log([].slice.call(obj))
      
    ;[].forEach.call(obj, function (num, index) {
        console.log(num)
    })
    
    
    
    # 2.
    function test() {
        return  [].slice.call(arguments)
    }
    var list = test(4, 5, 6) // [4,5,6]
    console.log(list)
    
    # 【重要理解】
    通过call()将[].slice中的this指向了arguments,使其拥有了slice方法。
    slice()如果不传参则是从第0项开始截取到length-1项并返回截取后的数组[4,5,6]。
    上面其实就是省略了call()的第二个参数,你可以把它看作为[].slice.call(arguments,0)
    
    
    1. slice更加详细的解释
    
    Array.prototype.mySlice = function () {
      var start = 0
      var end = this.length
      if (arguments.length === 1) {
        start = arguments[0]
      } else if (arguments.length === 2) {
        start = arguments[0]
        end = arguments[1]
      }
      var tmp = []
      for (var i = start; i < end; i++) {
        // fakeArr[0]
        // fakeArr[1]
        // fakeArr[2]
        tmp.push(this[i])
      }
      return tmp
    }
    
    var fakeArr = {
      0: 'abc',
      1: 'efg',
      2: 'haha',
      length: 3
    }
    
    // 所以你就得到了真正的数组。 
    [].mySlice.call(fakeArr)
    
  • 相关阅读:
    javascript中map的用法
    洛谷P1057传球游戏-题解
    洛谷P1049装箱问题-题解
    洛谷P1048采药-题解
    洛谷P1044栈-题解
    洛谷P1040加分二叉树-题解
    洛谷P1005矩阵取数游戏-题解
    洛谷P1004方格取数-题解
    洛谷P1002过河卒-题解
    搜索
  • 原文地址:https://www.cnblogs.com/amize/p/14883490.html
Copyright © 2011-2022 走看看