为何修改Object.prototype会导致Chart.js库无法加载？

这事儿本质上是原型链污染搞的鬼！当你给Object.prototype添加可枚举属性时，所有JavaScript对象（包括Chart.js内部创建的对象）都会继承这个属性，而旧版本的Chart.js（比如你用的2.7.2）在遍历对象时没有过滤原型链上的属性，直接踩坑了。

具体报错原因 #

Chart.js 2.7.2的内部代码里，大概率有使用for...in循环遍历对象的逻辑，而且没有搭配hasOwnProperty()来判断属性是否属于对象自身。举个贴合你报错场景的例子：假设Chart.js里有一段解析配置的代码，会用正则匹配属性名，比如：

var config = { /* 内部配置项 */ };
for (var key in config) {
  // 期望key是特定格式的字符串，用正则提取内容
  var matchResult = key.match(/^(\w+)-(\d+)$/);
  // 如果key是原型上的`someNewProperty`，正则匹配失败返回null
  var targetValue = matchResult[1]; // 这里就会抛出"Cannot read property '1' of null"
}

当你的自定义属性someNewProperty被for...in遍历到时，正则匹配失败返回null，代码尝试读取null[1]就触发了你看到的报错。

解决办法 #

• 最稳妥的方案：别直接修改Object.prototype：这是JavaScript开发的通用禁忌，会污染所有对象的原型链，引发各种第三方库的兼容性问题。
• 如果非要加属性，设为不可枚举：用Object.defineProperty把属性设置为enumerable: false，这样for...in循环就不会遍历到它：

  Object.defineProperty(Object.prototype, 'someNewProperty', {
    value: 'some value',
    enumerable: false, // 核心：让属性不可枚举
    writable: true,
    configurable: true
  });
  

• 升级Chart.js版本：新版本的Chart.js已经修复了这类问题，会使用Object.keys()、Object.entries()这类只遍历对象自身属性的方法，或者在for...in循环里加hasOwnProperty()判断，避免原型属性干扰。

内容的提问来源于stack exchange，提问作者Grigory Hatsevich