javascript - Chromium 不会复制数组值

标签 javascript arrays html canvas chromium

我正在使用 Webworker 处理来自 Canvas 的像素数组,并在将其返回后 - 分配给 ImageData 数组。 Firefox 运行良好,但 Chromium 将一个空像素数组放入 Canvas。调查表明数组复制不起作用,生成的数组包含空元素。数组切片也没有帮助,只有用 for in 遍历每个元素才有帮助,但我想知道这里有什么问题?

imgd = ctx.createImageData(w,h);
worker.onmessage = function (e) {
  imgd.data = e.data; 
  console.log(imgd.data === e.data); // true in FF, false in Chromium  

  img.data = e.data.slice(0); 
  console.log(imgd.data); // correct in FF, empty array in Chromium
};

最佳答案

Chrome :

> var e = document.createElement('canvas').getContext('2d').createImageData(10, 10).data;
undefined
> Object.prototype.toString.call(e)
"[object ImageData]"
> e.slice
undefined

效果4:

>>> var e = document.createElement('canvas').getContext('2d').createImageData(10, 10).data;
undefined
>>> Object.prototype.toString.call(e)
"[object Uint8ClampedArray]"
>>> e.slice
slice()

歌剧:

>>> var e = document.createElement('canvas').getContext('2d').createImageData(10, 10).data;
undefined
>>> Object.prototype.toString.call(e)
"[object CanvasPixelArray]"
>>> e.slice
undefined

这告诉我们什么?那么规范nowhere states像素数据数组应该有类似数组的方法。

因此,仅在可用时使用 .slice,否则执行 for 循环 复制,哦,还要在 2 个以上的浏览器中进行测试。

关于javascript - Chromium 不会复制数组值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4377099/

相关文章:

c# - 在哪里可以将 "Trim"添加到此 C# 语句?

css - 填充元素之间的剩余宽度并剪切文本

html - 使用 <span> 标签在 HTML 中编写颜色编码的 XML 代码导致空格

javascript - Angularjs 1.5x : How to call a function only once in a template and reuse the result in multiple places

c - C语言中如何比较两个数组?

c# - 将具有零字符元素的字符数组转换为 C# 字符串

html - 多个元素的 css 中的垂直对齐(如何实现此布局)

javascript - Web 组件 - 每个插槽多个元素

javascript - DOM 更改时触发一次事件

javascript - InDesign 启动脚本不从 XML 导入加载图像的问题