【问题标题】:Normalize Array methods and return values规范化数组方法和返回值
【发布时间】:2012-10-19 15:45:17
【问题描述】:

是否有任何 JavaScript 数组库可以规范化数组返回值和突变?我认为 JavaScript Array API 非常不一致。

一些方法会改变数组:

var A = [0,1,2];
A.splice(0,1); // reduces A and returns a new array containing the deleted elements

有些没有:

A.slice(0,1); // leaves A untouched and returns a new array

一些返回对变异数组的引用:

A = A.reverse().reverse(); // reverses and then reverses back

有些只是返回未定义:

B = A.forEach(function(){});

我想要的是总是改变数组并总是返回相同的数组,这样我就可以有某种一致性,也可以链接。例如:

A.slice(0,1).reverse().forEach(function(){}).concat(['a','b']);

我尝试了一些简单的 sn-ps,例如:

var superArray = function() {
    this.length = 0;
}

superArray.prototype = {
    constructor: superArray,

    // custom mass-push method
    add: function(arr) {
        return this.push.apply(this, arr);
    }
}

// native mutations
'join pop push reverse shift sort splice unshift map forEach'.split(' ').forEach(function(name) {
    superArray.prototype[name] = (function(name) {
        return function() {
            Array.prototype[name].apply(this, arguments);
            // always return this for chaining
            return this;
        };
    }(name));
});

// try it
var a = new superArray();
a.push(3).push(4).reverse();

这适用于大多数变异方法,但存在问题。例如,我需要为每个不改变原始数组的方法编写自定义原型。

所以当我这样做的时候,我一直在想,也许这以前已经做过了?是否已经有任何轻量级数组库可以做到这一点?如果该库还为旧版浏览器的新 JavaScript 1.6 方法添加填充程序,那就太好了。

【问题讨论】:

  • 您提供的示例 - A.slice(0,1).reverse().forEach(function(){}); - 按预期工作。我不确定你对这个例子的意义是什么。您声明您希望能够进行链接,然后您举了一个使用现有方法进行链接的示例,这是可行的。请提供与现有方法一起使用的示例,以便我了解您将能够写什么。
  • @ŠimeVidas 不,它没有,因为slice 不会像我想要的那样改变数组 - 它返回一个新数组。如果有帮助,我可以举更多例子
  • .pop().shift() 怎么样?他们从数组中删除一个元素,并返回该元素。你想让他们返回数组吗?
  • @ŠimeVidas 是的,这就是重点:将变异的数组保留在实例中。
  • 如果所有方法都返回原始数组,您将如何提取数组的一部分?

标签: javascript arrays libraries shim


【解决方案1】:

恕我直言,最好的库之一是 underscorejs http://underscorejs.org/

【讨论】:

    【解决方案2】:

    我不认为这真的是不一致的。是的,它们可能有点令人困惑,因为 JavaScript 数组可以完成其他语言具有单独结构(列表、队列、堆栈……)的所有事情,但它们的定义在不同语言中是非常一致的。您可以轻松地将它们分组到您已经描述的类别中:

    • 列出方法:
      • push/unshift添加元素后返回长度
      • pop/shift返回请求的元素
      • 您可以定义其他方法来获取第一个和最后一个元素,但很少需要它们
    • splice 是用于移除/替换/插入列表中间项目的通用工具 - 它返回已移除元素的数组。
    • sortreverse 是两种标准的就地重新排序方法。

    所有其他方法不修改原始数组:

    • slice 按位置获取子数组,filter 按条件获取子数组,concat 与其他人组合创建并返回新数组
    • forEach 只是迭代数组,什么都不返回
    • every/some 测试项目的条件,indexOflastIndexOf 搜索项目(通过相等) - 都返回他们的结果
    • reduce/reduceRight 将数组项减少为单个值并返回。特殊情况是:
      • map 简化为一个新数组 - 它类似于 forEach 但返回结果
      • jointoString 缩减为字符串

    这些方法足以满足我们的大部分需求。我们可以用它们做几乎所有事情,而且我不知道有任何库向它们添加了类似但在内部或结果方面不同的方法。大多数数据处理库(如Underscore)只使它们跨浏览器安全(es5-shim)并提供额外的实用方法。

    我想要的是总是改变数组并总是返回相同的数组,这样我就可以有某种一致性,也可以链接。

    我想说 JavaScript 的一致性是在元素或长度被修​​改时总是返回一个新数组。我猜这是因为对象是引用值,更改它们经常会在引用同一数组的其他作用域中产生副作用。

    链接仍然是可能的,你可以使用sliceconcatsortreversefiltermap一起创建一个新数组只需一步。如果只想“修改”数组,只需将其重新分配给数组变量:

    A = A.slice(0,1).reverse().concat(['a','b']);
    

    变异方法对我来说只有一个优势:它们更快,因为它们可能更节省内存(当然,取决于实现及其垃圾收集)。因此,让我们为这些实现一些方法。由于Array subclassing既不可能也没有用,我将在native prototype上定义它们:

    var ap = Array.prototype;
    // the simple ones:
    ap.each = function(){ ap.forEach.apply(this, arguments); return this; };
    ap.prepend = function() { ap.unshift.apply(this, arguments); return this; };
    ap.append = function() { ap.push.apply(this, arguments; return this; };
    ap.reversed = function() { return ap.reverse.call(ap.slice.call(this)); };
    ap.sorted = function() { return ap.sort.apply(ap.slice.call(this), arguments); };
    // more complex:
    ap.shorten = function(start, end) { // in-place slice
        if (Object(this) !== this) throw new TypeError();
        var len = this.length >>> 0;
        start = start >>> 0; // actually should do isFinite, then floor towards 0
        end = typeof end === 'undefined' ? len : end >>> 0; // again
        start = start < 0 ? Math.max(len + start, 0) : Math.min(start, len);
        end = end < 0 ? Math.max(len + end, 0) : Math.min(end, len);
        ap.splice.call(this, end, len);
        ap.splice.call(this, 0, start);
        return this;
    };
    ap.restrict = function(fun) { // in-place filter
        // while applying fun the array stays unmodified
        var res = ap.filter.apply(this, arguments);
        res.unshift(0, this.length >>> 0);
        ap.splice.apply(this, res);
        return this;
    };
    ap.transform = function(fun) { // in-place map
        if (Object(this) !== this || typeof fun !== 'function') throw new TypeError();
        var len = this.length >>> 0,
            thisArg = arguments[1];
        for (var i=0; i<len; i++)
            if (i in this)
                this[i] = fun.call(thisArg, this[i], i, this)
        return this;
    };
    // possibly more
    

    现在你可以做

    A.shorten(0, 1).reverse().append('a', 'b');
    

    【讨论】:

      【解决方案3】:

      您可能不应该为此使用库(添加到项目中的依赖项不是那么有用)。

      “标准”方法是在您想要执行变异操作时调用slice。这样做没有问题,因为 JS 引擎非常适合使用临时变量(因为这是 javascript 的关键点之一)。

      例如。 :

      function reverseStringify( array ) {
          return array.slice( )
              .reverse( )
              .join( ' ' ); }
      
      console.log( [ 'hello', 'world' ] );
      

      【讨论】:

        猜你喜欢
        • 2012-03-20
        • 2017-09-26
        • 1970-01-01
        • 2017-01-28
        • 1970-01-01
        • 1970-01-01
        • 2014-07-04
        • 2018-03-29
        • 2011-06-09
        相关资源
        最近更新 更多