在JavaScript中处理点/小向量的最有效方法是什么?

Chr*_*ris 6 javascript arrays performance object

目前我正在创建一个基于Web的(= JavaScript)应用程序,它使用了很多"点"(=小的,固定大小的向量).基本上有两种表现方式:

var pointA = [ xValue, yValue ];
Run Code Online (Sandbox Code Playgroud)

var pointB = { x: xValue, y: yValue };
Run Code Online (Sandbox Code Playgroud)

所以翻译我的观点会是这样的:

var pointAtrans = [ pointA[0] + 3, pointA[1] + 4 ];
var pointBtrans = { x: pointB.x + 3, pointB.y + 4 };
Run Code Online (Sandbox Code Playgroud)

从程序员的角度来看,这两者都很容易处理(对象变体更具可读性,特别是因为我主要处理2D数据,很少使用3D而很难使用4D - 但是从来没有更多.它总是适合x,y,z和w)

但我现在的问题是:
从语言角度来看,最有效的方法是什么 - 理论上和实际实施中?
什么是内存要求?
数组与对象的设置成本是多少?
...

我的目标浏览器是FireFox和基于Webkit的浏览器(Chromium,Safari),但在IE和Opera下获得一个很棒的(快速)体验并不会有什么坏处......

gbl*_*zex 5

数组的创建速度更快,但如果考虑访问时间,则反过来.另请注意,构造函数表单可以快速创建和访问.它在现代实现中具有最好的两个词 new Vector(x, y)- [ 测试 ] 替代文字

浏览器测试: Chrome 10,Firefox 3.6,Firefox Beta 4.0b9,IE 9 Preview 7,Opera 11

  • 数组和对象访问在Chrome 8中几乎没有区别.但是阵列创建要快得多. (2认同)

Chr*_*ris 2

感谢您的所有答案和意见。galamalazs 编写的测试结果非常有趣:http://jsperf.com/object-vs-array/2

将所有方面综合起来我们将得到:

  • 数组应该按数字而不是字符串索引(arr[0] 与 arr['0'])
  • 对象和数组形式之间的性能差异主要取决于实现而不是类型。
  • 没有赢家,从实施到实施都有变化
  • 当今已知的浏览器的未来实现也可能会改变谁是赢家——无论哪种方式
  • 在 Chromium 上,数组将使用对象内存的一半 - 但我们谈论的是 100 万个实例的 40 MB 和 80 MB - 即每个 40 到 80 字节。
  • 其他 JavaScript 实现的内存消耗尚不清楚 - 但它很可能也与性能一样不同。

所以最终这两个选项都是明智的,只有代码可读性才能做出决定!

如果主要用于存储琐碎工作的数据(就像在我当前的项目中),则对象方式是最佳选择。和mouse.x简单mouse.y地表明了开发人员的意图。

在大多数面向数学的应用程序中,使用向量数学(例如坐标变换(尤其是 3D)),最好的方法是数组情况,因为矩阵乘法之类的东西对开发人员来说看起来更原生并显示出他的意图。