Javascript 如何在 IE 11 中合并对象
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/42091600/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to merge object in IE 11
提问by David
I have the following array of object:
我有以下对象数组：
Objs[0] = {Name : "ABC"};
Objs[1] = {Roll : 123}
I'm trying to make it as the following:
我正在尝试使其如下所示：
Objs {
Name : "ABC",
Roll : 123
}
I attempted to make it with the following code:
我尝试使用以下代码实现它：
var Objs = [{
Name: "ABC"
}, {
Roll: 123
}];
console.log(
Object.assign.apply(null, [{}].concat(Objs)) // 1
)
or
console.log(
Object.assign({}, ...Objs) // 2
)
The problem is that this is not working in IE 11.
问题是这在 IE 11 中不起作用。
I get the errors:
我收到错误：
Error for 1 : Unable to get property 'on' of undefined or null reference
Error for 2 : Object doesn't support property or method 'assign'
错误 1：无法获取未定义或空引用的属性“on”
错误 2：对象不支持属性或方法“分配”
Any suggestions on how I should merge the object in IE 11?
关于如何在 IE 11 中合并对象的任何建议？
回答by Nebojsa Sapic
You can use jQuery method $.extend()which work in IE 11.
您可以使用适用于 IE 11 的jQuery 方法$.extend()。
var object = {name: 'John', surname: 'Rowland'};
var newObject = $.extend({}, object);
newObject.age = '30';
console.log(object);
console.log(newObject)<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>回答by Nina Scholz
IE11 does not support Object.assign.
IE11 不支持Object.assign.
You could iterate the array and the keys and take the values as new property of the result object.
您可以迭代数组和键，并将值作为结果对象的新属性。
var objs = [{ Name: "ABC" }, { Roll: 123 }],
result = objs.reduce(function (r, o) {
Object.keys(o).forEach(function (k) {
r[k] = o[k];
});
return r;
}, {});
console.log(result);回答by vladatr
Install:
安装：
npm i -s babel-polyfill
And at the top of entry index.jsfile add:
在入口index.js文件的顶部添加：
import 'babel-polyfill'
This will solve some issues that Babel did not. Object.assignis one of them.
这将解决一些 Babel 没有解决的问题。Object.assign就是其中之一。
This means you can use new built-ins like Promise or WeakMap, static methods like Array.from or Object.assign, instance methods like Array.prototype.includes, and generator functions (provided you use the regenerator plugin). The polyfill adds to the global scope as well as native prototypes like String in order to do this.
这意味着你可以使用像 Promise 或 WeakMap 这样的新内置函数，像 Array.from 或 Object.assign 这样的静态方法，像 Array.prototype.includes 这样的实例方法，以及生成器函数（前提是你使用了 regenerator 插件）。为了做到这一点，polyfill 添加到全局范围以及像 String 这样的原生原型。
For the end, you will need to decide whether you want to use the whole babel-polyfill(which is around 50kb minimized) or to use only what you need through individual polyfills, ie. es6-promisefor Promises.
最后，您需要决定是要使用整个babel-polyfill（最小化约 50kb）还是仅通过单个 polyfill 使用您需要的东西，即。es6-promise用于Promise。
回答by bladekp
I think best thing to do, if you are using lodash util library in your project, is lodash's assignmethod, which works same as Object.prototype.assign for all browsers, including IE (at least IE11): https://lodash.com/docs/4.17.4#assign
我认为最好的办法是，如果您在项目中使用 lodash util 库，则是 lodash 的分配方法，该方法与 Object.prototype.assign 的工作方式相同，适用于所有浏览器，包括 IE（至少 IE11）：https://lodash。 com/docs/4.17.4#assign
If you are not using lodash yet, consider it. It has many util functions which works perfectly fine on all browsers, either in JavaScript, TypeScript and NodeJS (tested by myself, but probably it supports other JS connected technologies as well). Personally I include lodash to all my javascript connected projects
如果您还没有使用 lodash，请考虑一下。它有许多 util 函数，可以在所有浏览器上完美运行，无论是 JavaScript、TypeScript 还是 NodeJS（我自己测试过，但它可能也支持其他 JS 连接技术）。我个人将 lodash 包含到我所有的 javascript 连接项目中
回答by oztecnic
Use a polyfill like this; Ref: MDN
使用这样的 polyfill；参考： MDN
if (typeof Object.assign != 'function') {
// Must be writable: true, enumerable: false, configurable: true
Object.defineProperty(Object, "assign", {
value: function assign(target, varArgs) { // .length of function is 2
'use strict';
if (target == null) { // TypeError if undefined or null
throw new TypeError('Cannot convert undefined or null to object');
}
var to = Object(target);
for (var index = 1; index < arguments.length; index++) {
var nextSource = arguments[index];
if (nextSource != null) { // Skip over if undefined or null
for (var nextKey in nextSource) {
// Avoid bugs when hasOwnProperty is shadowed
if (Object.prototype.hasOwnProperty.call(nextSource, nextKey)) {
to[nextKey] = nextSource[nextKey];
}
}
}
}
return to;
},
writable: true,
configurable: true
});
}
回答by ênio Abrantes
If you are using TypeScript, try to replace Object.assign({}, ...Objs)to {...Objs};the browser will automatically replace it to __assign({}, Objs);and this notacion works in IE11.
如果您使用的是 TypeScript，请尝试替换Object.assign({}, ...Objs)为{...Objs};浏览器会自动替换为，__assign({}, Objs);并且此符号在 IE11 中有效。
回答by cheesus
If you use TypeScript you can use
如果您使用打字稿，您可以使用
let newObject = {
...existingObject
}
This creates a shallow copy of the existing object.
这将创建现有对象的浅表副本。
回答by thedanotto
Even with babel:
即使使用 babel：
const newObj = Object.assign({}, myOtherObject)
was destroying us in IE11.
在 IE11 中摧毁了我们。
We changed it to:
我们将其更改为：
const newObj = { ...myOtherObject }
and that worked in conjunction with babel.
这与 babel 一起工作。
回答by heriberto perez
In addition to @vladatr, in case you're using Wepack:
除了@vladatr，如果您使用的是 Wepack：
In your webpack.config.js
在你的 webpack.config.js 中
const path = require("path");
module.exports = {
entry: ["babel-polyfill", path.resolve(__dirname, "../src/index.js")],
.
.
In my entry point src/index.jsfile:
在我的入口点src/index.js文件中：
import "babel-polyfill";
