Javascript 严格模式下的ImageData数据分配

假设我有这样的PoC代码片段用于处理

canvas

raw像素数据

(function(){
  'use strict';
  var img = document.createElement("canvas").getContext("2d").getImageData(0, 0, 1, 1);
  var imgData = img.data;
  img.data = imgData;
})();

问题是我得到了一个合理的错误（我已经检查了最新的Chrome和FF）

TypeError:无法分配给的只读属性“data”#

所以，我可以禁用严格模式，一切都会变得完美，但有没有可能在严格模式下实现这一点？也许我只是没有在setter上找到

数据的文档

谢谢
 您应该改用
putImageData（）
。查看以获取帮助
阅读代码中的注释：

(function(){
  'use strict';
  var canvas=document.createElement("canvas");
  // canvas object must have size
  var w=canvas.width=100;
  var h=canvas.height=50;
  var ctx=canvas.getContext("2d");
  var imgData=ctx.getImageData(0,0,w,h);
  // In next line you retrieve array of RGBA values where each array element
  // is value between 0 and 255. Array size is size imgData.width*imgData.height
  var pixelData = imgData.data;
  pixelData[0] = 128; // Store 128 for Red channel of first pixel: (0,0)
  pixelData[5] = 128; // Store 128 for Green channel of second pixel
  imgData.data = pixelData; // Error
})();

您还可以使用
putImageData
方法使用另一个CanvasImageData对象修改画布的内容：

  var newImgData=ctx.createImageData(w,h);
  ctx.putImageData(newImgData,0,0);

阅读MDN:和MSDN:中的CanvasImageData

MSDN中的HTML5画布：
禁用严格模式只会使其无声地失败。即使没有错误，它仍然无法工作，只是当事情无声地失败时，调试会更加困难。
  var newImgData=ctx.createImageData(w,h);
  ctx.putImageData(newImgData,0,0);