从对象中删除额外的属性

Question

What would be the best way to remove any additional properties from an object that is not defined in defaults object?

var 

defaults = {

    color : 'blue',
    size: 9,
    price : 40.00,
    instock : true

},

newItem = {

    color: 'red',
    size : 4,
    price : 20.00
    extra : invalid // discard this
    extra1 : invalid // discard this

},

item = $.extend( defaults, newObject ) ;

Desired output....

{
    color : 'red',
    size: 4,
    price : 20.00,
    instock : true

}

Answer 1

Before you call $.extend, put the following.

for(variable in newItem) {
    if(!(variable in defaults)) {
        delete newItem[variable];
    }
}

This will loop over every key in newItem and check that it is also a key in defaults . Note that this will modify newItem , so if that is not desired, you'll need to do some tweaking.

Answer 2

You could reduce Object.keys(defaults) to an object containing either the override value or the default value:

 var defaults = { color : 'blue', size: 9, price : 40.00, instock : true }, newItem = { color: 'red', size : 4, price : 20.00, extra : 'invalid', extra1 : 'invalid' }; function getOverrides(defaults, obj) { return Object.keys(defaults).reduce(function(result, cur) { result[cur] = cur in obj ? obj[cur] : defaults[cur]; return result; }, {}); } console.log(getOverrides(defaults, newItem)); 

Answer 3

According to this performance comparison: https://jsperf.com/dictionary-contains-key

The most efficient way to do this is:

for(attr in newItem) {
  if(defaults[attr] === undefined)
    delete newItem[attr];
}

Answer 4

Only merge properties which existing in defaults object: (simple and supports old browsers)

 var defaults = { color : 'blue', size: 9, price : 40.00, instock : true }; var newItem = { color: 'red', size : 4, price : 20.00, extra : 'invalid', // discard this extra1 : 'invalid' // discard this }; var result = {}; for (var i in defaults) { result[i] = newItem.hasOwnProperty(i) ? newItem[i] : defaults[i]; } console.log(result); 

Answer 5

Some code that I have been playing with that may be of interest, and an example of how to use it with your question.

 'use strict'; var slice = Function.call.bind(Array.prototype.slice); var reflectAssign = function assign(target) { return slice(arguments, 1).every(function(source) { if (source == null) { return true; } var object = Object(source); return Reflect.ownKeys(object).every(function(key) { return Reflect.set(target, key, object[key]); }); }); }; var reflectAssignHas = function(target) { var targetKeys = Reflect.ownKeys(target); return slice(arguments, 1).every(function(source) { if (source == null) { return true; } var object = Object(source); return targetKeys.every(function(key) { return Reflect.has(object, key) ? Reflect.set(target, key, object[key]) : true }); }); }; var defaults = { color: 'blue', size: 9, price: 40.00, instock: true }; var newItem = { color: 'red', size: 4, price: 20.00, extra: 'invalid', // discard this extra1: 'invalid' // discard this }; var item = {}; console.log(reflectAssign(item, defaults)); console.log(reflectAssignHas(item, newItem)); console.log(item); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.9/es5-shim.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.9/es5-sham.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.35.3/es6-shim.js"></script>