279

是否有与 Python 的 zip 函数等效的 javascript？也就是说，给定多个相等长度的数组创建一个对数组。

例如，如果我有三个如下所示的数组：

var array1 = [1, 2, 3];
var array2 = ['a','b','c'];
var array3 = [4, 5, 6];

输出数组应为：

var output array:[[1,'a',4], [2,'b',5], [3,'c',6]]
4

23 回答 23

220

2016 年更新：

这是一个更时髦的 Ecmascript 6 版本：

zip= rows=>rows[0].map((_,c)=>rows.map(row=>row[c]))

插图相当于。到Python { zip(*args)}：

> zip([['row0col0', 'row0col1', 'row0col2'],
       ['row1col0', 'row1col1', 'row1col2']]);
[["row0col0","row1col0"],
 ["row0col1","row1col1"],
 ["row0col2","row1col2"]]

（并且 FizzyTea 指出 ES6 具有可变参数语法，因此下面的函数定义将像 python，但请参阅下面的免责声明......这不会是它自己的逆，所以zip(zip(x))不会相等x；尽管正如 Matt Kramer 指出的那样zip(...zip(...x))==x（如在常规 python 中zip(*zip(*x))==x））

替代定义等价。到Python { zip}：

> zip = (...rows) => [...rows[0]].map((_,c) => rows.map(row => row[c]))
> zip( ['row0col0', 'row0col1', 'row0col2'] ,
       ['row1col0', 'row1col1', 'row1col2'] );
             // note zip(row0,row1), not zip(matrix)
same answer as above

（请注意，...语法目前可能存在性能问题，将来也可能存在问题，因此，如果您使用带有可变参数的第二个答案，您可能需要对其进行性能测试。也就是说，自从它出现以来已经有一段时间了标准。）

如果您希望在字符串上使用它，请务必注意附录（也许现在使用 es6 迭代有更好的方法）。

这是一个单线：

function zip(arrays) {
    return arrays[0].map(function(_,i){
        return arrays.map(function(array){return array[i]})
    });
}

// > zip([[1,2],[11,22],[111,222]])
// [[1,11,111],[2,22,222]]]

// If you believe the following is a valid return value:
//   > zip([])
//   []
// then you can special-case it, or just do
//  return arrays.length==0 ? [] : arrays[0].map(...)

以上假设数组大小相同，因为它们应该是相同的。它还假设您传入一个列表参数列表，这与参数列表是可变参数的 Python 版本不同。如果您想要所有这些“功能”，请参见下文。它只需要大约 2 行额外的代码。

以下将模仿 Pythonzip在数组大小不相等的边缘情况下的行为，默默地假装数组的较长部分不存在：

function zip() {
    var args = [].slice.call(arguments);
    var shortest = args.length==0 ? [] : args.reduce(function(a,b){
        return a.length<b.length ? a : b
    });

    return shortest.map(function(_,i){
        return args.map(function(array){return array[i]})
    });
}

// > zip([1,2],[11,22],[111,222,333])
// [[1,11,111],[2,22,222]]]

// > zip()
// []

这将模仿 Python 的itertools.zip_longest行为，插入undefined未定义数组的位置：

function zip() {
    var args = [].slice.call(arguments);
    var longest = args.reduce(function(a,b){
        return a.length>b.length ? a : b
    }, []);

    return longest.map(function(_,i){
        return args.map(function(array){return array[i]})
    });
}

// > zip([1,2],[11,22],[111,222,333])
// [[1,11,111],[2,22,222],[null,null,333]]

// > zip()
// []

如果您使用这最后两个版本（variadic aka.multi-argument 版本），那么 zip 不再是它自己的逆。为了模仿zip(*[...])Python 中的习语，zip.apply(this, [...])当您想要反转 zip 函数或者想要类似地将可变数量的列表作为输入时，您需要这样做。

附录：

为了使这个处理任何可迭代的（例如，在 Python 中，您可以zip在字符串、范围、地图对象等上使用），您可以定义以下内容：

function iterView(iterable) {
    // returns an array equivalent to the iterable
}

但是，如果您zip按以下方式编写，则即使这样也没有必要：

function zip(arrays) {
    return Array.apply(null,Array(arrays[0].length)).map(function(_,i){
        return arrays.map(function(array){return array[i]})
    });
}

演示：

> JSON.stringify( zip(['abcde',[1,2,3,4,5]]) )
[["a",1],["b",2],["c",3],["d",4],["e",5]]

（或者，range(...)如果您已经编写了一个 Python 风格的函数，也可以使用它。最终，您将能够使用 ECMAScript 数组解析或生成器。）

于 2012-04-23T15:58:42.350 回答
45

查看库Underscore。

Underscore 提供了 100 多个函数，它们支持您最喜欢的日常功能助手：map、filter、invoke — 以及更专业的好东西：函数绑定、javascript 模板、创建快速索引、深度相等测试等等。

– 说制作它的人

我最近开始专门为这个zip()功能使用它，它给人留下了很好的第一印象。我正在使用 jQuery 和 CoffeeScript，它与它们完美搭配。下划线从他们离开的地方开始，到目前为止它并没有让我失望。哦，顺便说一句，它只有 3kb 缩小。

一探究竟：

_.zip(['moe', 'larry', 'curly'], [30, 40, 50], [true, false, false]);
// returns [["moe", 30, true], ["larry", 40, false], ["curly", 50, false]]
于 2011-08-31T16:53:42.207 回答
25

带有生成器的现代 ES6 示例：

function *zip (...iterables){
    let iterators = iterables.map(i => i[Symbol.iterator]() )
    while (true) {
        let results = iterators.map(iter => iter.next() )
        if (results.some(res => res.done) ) return
        else yield results.map(res => res.value )
    }
}

首先，我们得到一个迭代列表作为iterators. 这通常是透明地发生的，但在这里我们明确地这样做，因为我们一步一步地让步，直到其中一个用尽。我们检查给定数组中的任何结果（使用.some()方法）是否已用尽，如果是，则中断 while 循环。

于 2018-01-17T04:23:25.957 回答
18

除了 ninjagecko 出色而全面的答案之外，将两个 JS 数组压缩成“元组模拟”所需的全部内容是：

//Arrays: aIn, aOut
Array.prototype.map.call( aIn, function(e,i){return [e, aOut[i]];})

说明：
由于 Javascript 没有tuples类型，元组、列表和集合的函数在语言规范中不是高优先级。否则，可以通过JS >1.6 中的 Array map 以
直接的方式访问类似的行为。（实际上经常由 JS 引擎制造商在许多 >JS 1.4 引擎中实现，尽管没有指定）。 与 Python 的, ,...的主要区别在于的函数风格，因为需要函数参数。此外，它是-instance 的函数。如果输入的额外声明是一个问题，则可以使用。map
zipizipmapmapArrayArray.prototype.map

例子：

_tarrin = [0..constructor, function(){}, false, undefined, '', 100, 123.324,
         2343243243242343242354365476453654625345345, 'sdf23423dsfsdf',
         'sdf2324.234dfs','234,234fsf','100,100','100.100']
_parseInt = function(i){return parseInt(i);}
_tarrout = _tarrin.map(_parseInt)
_tarrin.map(function(e,i,a){return [e, _tarrout[i]]})

结果：

//'('+_tarrin.map(function(e,i,a){return [e, _tarrout[i]]}).join('),\n(')+')'
>>
(function Number() { [native code] },NaN),
(function (){},NaN),
(false,NaN),
(,NaN),
(,NaN),
(100,100),
(123.324,123),
(2.3432432432423434e+42,2),
(sdf23423dsfsdf,NaN),
(sdf2324.234dfs,NaN),
(234,234fsf,234),
(100,100,100),
(100.100,100)

相关表现：

使用map过for循环：

请参阅：将 [1,2] 和 [7,8] 合并为 [[1,7], [2,8]] 的最有效方法是什么

压缩测试

注意：基本类型，例如falseandundefined不具有原型对象层次结构，因此不公开toString函数。因此，这些在输出中显示为空。
AsparseInt的第二个参数是基数/数字基数，将数字转换为该基数，并且由于map将索引作为第二个参数传递给其参数函数，因此使用了包装函数。

于 2013-07-28T11:58:58.010 回答
15

与其他类似 Python 的函数一起，pythonic提供了一个zip函数，具有返回惰性评估的额外好处Iterator，类似于其Python 对应项的行为：

import {zip, zipLongest} from 'pythonic';

const arr1 = ['a', 'b'];
const arr2 = ['c', 'd', 'e'];
for (const [first, second] of zip(arr1, arr2))
    console.log(`first: ${first}, second: ${second}`);
// first: a, second: c
// first: b, second: d

for (const [first, second] of zipLongest(arr1, arr2))
    console.log(`first: ${first}, second: ${second}`);
// first: a, second: c
// first: b, second: d
// first: undefined, second: e

// unzip
const [arrayFirst, arraySecond] = [...zip(...zip(arr1, arr2))];

披露我是 Pythonic 的作者和维护者

于 2018-04-07T09:34:40.163 回答
9

Python 有两个压缩序列的函数：zip 和 itertools.zip_longest。相同功能的 Javascript 实现如下：

在 JS/ES6 上实现 Python 的 zip

const zip = (...arrays) => {
    const length = Math.min(...arrays.map(arr => arr.length));
    return Array.from({ length }, (value, index) => arrays.map((array => array[index])));
};

结果是：

console.log(zip(
    [1, 2, 3, 'a'],
    [667, false, -378, '337'],
    [111],
    [11, 221]
));

[ [ 1, 667, 111, 11 ] ]

console.log(zip(
    [1, 2, 3, 'a'],
    [667, false, -378, '337'],
    [111, 212, 323, 433, '1111']
));

[ [ 1, 667, 111 ], [ 2, false, 212 ], [ 3, -378, 323 ], [ 'a', '337', 433 ] ]

console.log(zip(
    [1, 2, 3, 'a'],
    [667, false, -378, '337'],
    [111],
    []
));

[]

在 JS/ES6 上实现 Python 的 zip_longest

（https://docs.python.org/3.5/library/itertools.html?highlight=zip_longest#itertools.zip_longest）

const zipLongest = (placeholder = undefined, ...arrays) => {
    const length = Math.max(...arrays.map(arr => arr.length));
    return Array.from(
        { length }, (value, index) => arrays.map(
            array => array.length - 1 >= index ? array[index] : placeholder
        )
    );
};

结果：

console.log(zipLongest(
    undefined,
    [1, 2, 3, 'a'],
    [667, false, -378, '337'],
    [111],
    []
));

[ [ 1, 667, 111, undefined ], [ 2, false, undefined, undefined ],
[ 3, -378, undefined, undefined ], [ 'a', '337', undefined, undefined ] ]

console.log(zipLongest(
    null,
    [1, 2, 3, 'a'],
    [667, false, -378, '337'],
    [111],
    []
));

[ [ 1, 667, 111, null ], [ 2, false, null, null ], [ 3, -378, null, null ], ['a', '337', null, null ] ]

console.log(zipLongest(
    'Is None',
    [1, 2, 3, 'a'],
    [667, false, -378, '337'],
    [111],
    []
));

[ [ 1, 667, 111, 'Is None' ], [ 2, false, 'Is None', 'Is None' ],
[ 3, -378, 'Is None', 'Is None' ], [ 'a ', '337', '没有', '没有'] ]

于 2016-12-30T13:50:42.180 回答
6

您可以使用 ES6 制作实用程序函数。

console.json = obj => console.log(JSON.stringify(obj));

const zip = (arr, ...arrs) =>
  arr.map((val, i) => arrs.reduce((a, arr) => [...a, arr[i]], [val]));

// Example

const array1 = [1, 2, 3];
const array2 = ['a','b','c'];
const array3 = [4, 5, 6];

console.json(zip(array1, array2));         // [[1,"a"],[2,"b"],[3,"c"]]
console.json(zip(array1, array2, array3)); // [[1,"a",4],[2,"b",5],[3,"c",6]]

但是，在上述解决方案中，第一个数组的长度定义了输出数组的长度。

这是您可以更好地控制它的解决方案。这有点复杂，但值得。

function _zip(func, args) {
  const iterators = args.map(arr => arr[Symbol.iterator]());
  let iterateInstances = iterators.map((i) => i.next());
  ret = []
  while(iterateInstances[func](it => !it.done)) {
    ret.push(iterateInstances.map(it => it.value));
    iterateInstances = iterators.map((i) => i.next());
  }
  return ret;
}
const array1 = [1, 2, 3];
const array2 = ['a','b','c'];
const array3 = [4, 5, 6];

const zipShort = (...args) => _zip('every', args);

const zipLong = (...args) => _zip('some', args);

console.log(zipShort(array1, array2, array3)) // [[1, 'a', 4], [2, 'b', 5], [3, 'c', 6]]
console.log(zipLong([1,2,3], [4,5,6, 7]))
// [
//  [ 1, 4 ],
//  [ 2, 5 ],
//  [ 3, 6 ],
//  [ undefined, 7 ]]

于 2019-04-12T09:13:38.690 回答
4

不是 Javascript 本身内置的。一些常见的 Javascript 框架（例如 Prototype）提供了实现，或者您可以编写自己的实现。

于 2011-01-31T22:11:47.197 回答
4

1.npm模块：zip-array

我找到了一个可以用作 javascript 版本的 python 的 npm 模块zip：

zip-array - Python 的 zip 函数的 javascript 等价物。将每个数组的值合并在一起。

https://www.npmjs.com/package/zip-array

2.tf.data.zip()在 Tensorflow.js 中

Tensorflow.js 用户的另一个替代选择是：如果您需要zippython 中的函数来处理 Javascript 中的 tensorflow 数据集，您可以tf.data.zip()在 Tensorflow.js 中使用。

Tensorflow.js 中的 tf.data.zip()记录在此处

于 2019-03-06T08:07:02.330 回答
3

和@Brandon 一样，我推荐 Underscore的zip功能。但是，它的作用类似于zip_longest，undefined根据需要附加值以返回最长输入长度的内容。

我使用该mixin方法用 a 扩展下划线zipShortest，它的作用类似于 Python 的zip，基于库自己的zip.

您可以将以下内容添加到您的常见 JS 代码中，然后将其作为下划线的一部分调用：例如，_.zipShortest([1,2,3], ['a'])returns 。[[1, 'a']]

// Underscore library addition - zip like python does, dominated by the shortest list
//  The default injects undefineds to match the length of the longest list.
_.mixin({
    zipShortest : function() {
        var args = Array.Prototype.slice.call(arguments);
        var length = _.min(_.pluck(args, 'length')); // changed max to min
        var results = new Array(length);
        for (var i = 0; i < length; i++) {
            results[i] = _.pluck(args, "" + i);
        }
        return results;
}});
于 2012-11-29T03:34:15.247 回答
3

原始答案（见下面的更新）

我修改了flm的漂亮答案以采用任意数量的数组：

 function* zip(arrays, i = 0) {
  while (i<Math.min(...arrays.map(({length})=>length))) {
    yield arrays.map((arr, j) => arr[j < arrays.length - 1 ? i : i++])
  }
 }

更新的答案

正如Tom Pohl所指出的，这个函数不能处理具有虚假值的数组。这是一个更新/改进的版本，可以处理任何类型以及不等长的数组：

 function* zip(arrays, i = 0) {
      while (i<Math.min(...arrays.map(arr=>arr.length))) {
        yield arrays.map((arr, j) => arr[j < arrays.length - 1 ? i : i++])
      }
     }
     
   const arr1 = [false,0,1,2]
const arr2 = [100,null,99,98,97]
const arr3 = [7,8,undefined,"monkey","banana"]

console.log(...zip([arr1,arr2,arr3]))

于 2020-11-07T17:43:00.257 回答
3

ES2020 最短变体：

function * zip(arr1, arr2, i = 0) {
  while(arr1[i] || arr2[i]) yield [arr1[i], arr2[i++]].filter(x => !!x);
}
    
[ ...zip(arr1, arr2) ]  // result
于 2020-07-05T12:43:18.850 回答
3

您可以通过获取内部数组索引的结果来减少数组数组并映射新数组。

var array1 = [1, 2, 3],
    array2 = ['a','b','c'],
    array3 = [4, 5, 6],
    array = [array1, array2, array3],
    transposed = array.reduce((r, a) => a.map((v, i) => (r[i] || []).concat(v)), []);

console.log(transposed);

传播的乐趣。

const
    transpose = (r, a) => a.map((v, i) => [...(r[i] || []), v]),
    array1 = [1, 2, 3],
    array2 = ['a','b','c'],
    array3 = [4, 5, 6],
    transposed = [array1, array2, array3].reduce(transpose, []);

console.log(transposed);

于 2018-10-19T20:29:49.047 回答
2

我在纯 JS 中对此进行了测试，想知道上面发布的插件是如何完成工作的。这是我的结果。我会先说我不知道​​这在 IE 等中会有多稳定。这只是一个快速的模型。

init();

function init() {
    var one = [0, 1, 2, 3];
    var two = [4, 5, 6, 7];
    var three = [8, 9, 10, 11, 12];
    var four = zip(one, two, one);
    //returns array
    //four = zip(one, two, three);
    //returns false since three.length !== two.length
    console.log(four);
}

function zip() {
    for (var i = 0; i < arguments.length; i++) {
        if (!arguments[i].length || !arguments.toString()) {
            return false;
        }
        if (i >= 1) {
            if (arguments[i].length !== arguments[i - 1].length) {
                return false;
            }
        }
    }
    var zipped = [];
    for (var j = 0; j < arguments[0].length; j++) {
        var toBeZipped = [];
        for (var k = 0; k < arguments.length; k++) {
            toBeZipped.push(arguments[k][j]);
        }
        zipped.push(toBeZipped);
    }
    return zipped;
}

它不是防弹的，但它仍然很有趣。

于 2011-01-31T22:46:55.830 回答
2

pythons zip 函数的生成器方法。

function* zip(...arrs){
  for(let i = 0; i < arrs[0].length; i++){
    a = arrs.map(e=>e[i])
    if(a.indexOf(undefined) == -1 ){yield a }else{return undefined;}
  }
}
// use as multiple iterators
for( let [a,b,c] of zip([1, 2, 3, 4], ['a', 'b', 'c', 'd'], ['hi', 'hello', 'howdy', 'how are you']) )
  console.log(a,b,c)

// creating new array with the combined arrays
let outputArr = []
for( let arr of zip([1, 2, 3, 4], ['a', 'b', 'c', 'd'], ['hi', 'hello', 'howdy', 'how are you']) )
  outputArr.push(arr)
于 2021-04-24T21:05:17.630 回答
2

惰性生成器解决方案的一种变体：

function* iter(it) {
    yield* it;
}

function* zip(...its) {
    its = its.map(iter);
    while (true) {
        let rs = its.map(it => it.next());
        if (rs.some(r => r.done))
            return;
        yield rs.map(r => r.value);
    }
}

for (let r of zip([1,2,3], [4,5,6,7], [8,9,0,11,22]))
    console.log(r.join())

// the only change for "longest" is some -> every

function* zipLongest(...its) {
    its = its.map(iter);
    while (true) {
        let rs = its.map(it => it.next());
        if (rs.every(r => r.done))
            return;
        yield rs.map(r => r.value);
    }
}

for (let r of zipLongest([1,2,3], [4,5,6,7], [8,9,0,11,22]))
    console.log(r.join())

这是 python 的经典“n-group”习语zip(*[iter(a)]*n)：

triples = [...zip(...Array(3).fill(iter(a)))]
于 2018-02-28T17:08:53.750 回答
1

我不是 javascript 人，但我觉得其中许多答案都在试图找到最可爱和最聪明的解决方案，使用Array.map这很好，但对于像我这样不每天使用 javascript 的人来说，这里有一些可能的替代方案更具可读性。

也许避免一些可爱而聪明的代码的方法是：

function zip(a,b){
    // pre-allocate an array to hold the results 
    rval=Array(Math.max(a.length, b.length));
    for(i=0; i<rval.length; i++){ 
        rval[i]=[a[i],b[i]] 
    }
    return rval
}

如果你喜欢生成器：

function* _zip(a,b){
    len = Math.max(a.length, b.length) // handle different sized arrays
    for(i=0; i<len; i++) { yield [a[i],b[i]] }
}

或者，如果您真的想使用Array.map：

function map(a,b){
    x = a.length > b.length ? a : b // call map on the biggest array
    return x.map((_,i)=>[a[i],b[i]])
}

正如我所说，我不是一个日常使用 javascript 的人，所以这些不会是最优雅的解决方案，但它们对我来说是可读的。

于 2021-10-07T21:24:32.317 回答
1

我创建了一个简单的函数来提供拉链功能

function zip(zipper, ...arrays) {
    if (zipper instanceof Array) {
        arrays.unshift(zipper)
        zipper = (...elements) => elements
    }

    const length = Math.min(...arrays.map(array => array.length))
    const zipped = []

    for (let i = 0; i < length; i++) {
        zipped.push(zipper(...arrays.map(array => array[i])))
    }

    return zipped
}

https://gist.github.com/AmrIKhudair/4b740149c29c492859e00f451832975b

于 2021-01-22T12:43:41.040 回答
0

Mochikit库提供了这个和许多其他类似 Python 的函数。Mochikit 的开发者也是 Python 爱好者，所以它具有 Python 的一般风格，并且将异步调用包装在类似扭曲的框架中。

于 2011-01-31T22:25:10.913 回答
0

没有等效的功能。如果您只有几个数组，您应该使用for循环来获取索引，然后使用索引来访问数组：

var array1 = [1, 2, 3];
var array2 = ['a','b','c'];

for (let i = 0; i < Math.min(array1.length, array2.length); i++) {
    doStuff(array1[i], array2[i]);
}

如果你有更多，你可以在数组上有一个内部循环。

于 2021-01-22T15:43:21.467 回答
0

下面是一种快速有效的方法，使用iter-ops库 operator zip：

const {pipe, zip} = require('iter-ops');

const i = pipe(array1, zip(array2, array3));

console.log(...i); //=> [ 1, 'a', 4 ] [ 2, 'b', 5 ] [ 3, 'c', 6 ]

该库将所有输入作为可迭代对象处理，因此它们只被迭代一次。它可以以同样的方式处理所有类型的可迭代对象 - Iterable, AsyncIterable, Iterator, AsyncIterator.

PS 我是iter-ops的作者。

于 2021-12-19T16:46:02.887 回答
-1

这从Ddi的基于迭代器的答案中减少了一条线：

function* zip(...toZip) {
  const iterators = toZip.map((arg) => arg[Symbol.iterator]());
  const next = () => toZip = iterators.map((iter) => iter.next());
  while (next().every((item) => !item.done)) {
    yield toZip.map((item) => item.value);
  }
}
于 2018-02-20T21:55:02.640 回答
-1

如果你对 ES6 没问题：

const zip = (arr,...arrs) =>(
                            arr.map(
                              (v,i) => arrs.reduce((a,arr)=>[...a, arr[i]], [v])))
于 2018-04-25T16:25:56.280 回答