ES6处理剩余的对象破坏性对象(对象修剪) [英] ES6 dispose of the object destructuring left-over (object trimming)

问题描述

与其余参数一起使用时，解构功能的一个很好用例是可以获取修剪后的克隆.

One nice use-case of the destructuring feature when used with rest parameters is that you can get trimmed clones.

var source = { w1: 'val1', w2: 'val2', unwanted1: 'val3', unwanted2: 'val4'};
var {unwanted1, unwanted2, ...target} = source;
console.log(target); // `{ w1: 'val1', w2: 'val2' }` Exactly what you want

但是，副作用是您的作用域现在被两个您永远不会使用的变量污染:unwanted1和unwanted2.

However, the side effect is that your scope is now polluted with two variables that you never care to use: unwanted1 and unwanted2.

如果_表示无关紧要，则可以执行以下操作

If _ meant don't care, you could do something like this

var {
  unwanted1:_, // throw away 
  unwanted2:_, // throw away
  target
} = source;

但是，在Javascript中，_是正确的标识符. 如果以这种方式使用一次(unwanted: _)，您将最终得到一个名为_的不需要的变量，这违背了目标. 如果多次使用(如上)，则会发出错误:

However, in Javascript _ is a proper identifier. If used once in that manner (unwanted: _), you'll end up with one unwanted variable called _, which goes against the goal. If used more than once, like above, an error is issued:

SyntaxError: Identifier '_' has already been declared.

有什么办法可以丢弃不需要的破坏产物/变量吗?

Is there any way I can throw away the undesired artifacts/variables of destructuring?

当然，以下解决方案始终可用.

Of course, the following solutions are always available.

var target = {
  w1: source.w1,
  w2: source.w2,
}

和

var target = {...source};
delete target.unwanted1;
delete target.unwanted2;

但是，如果要克隆具有许多参数的对象并且只需要排除几个对象，那么使用解构操作似乎是最干净的方法.

However doing this with destructuring only seems to be the cleanest way if you're cloning an object with many parameters and you need to exclude just a couple.

推荐答案

引入_，__，___等删除1,2,3个或更多属性并没有太大区别，因为它仍然创建变量，它们'...您将永远不会使用它'，此外，它还威胁到在代码中添加意大利面条的味道.

Introducing _, __, ___, etc to drop 1,2,3 or more properties doesn't make much difference as it still creates the variables, which '...you will never care to use' and moreover, it threatens to add a flavor of spaghetti to your code.

但是，由于您需要明确指出要删除的属性，因此可以考虑使用其他 object triming 技术，例如

However, since you need to indicate explicitly which exactly properties you want to drop, one may consider other object trimming techniques, e.g.

• 过滤不想要的属性

const obj = {prop1: 1, prop2:2, prop3: 3, prop4: 4, prop5: 5},
      keysToDrop = ['prop2', 'prop3', 'prop4'],
      
      trimmedObj = Object.fromEntries(
        Object
          .entries(obj)
          .filter(([key,val]) => !keysToDrop.includes(key)
        )
      )
      
console.log(trimmedObj)      

.as-console-wrapper{min-height:100%;}

与解构相比，
• 利用Array.prototype.reduce()甚至可以为您提供性能增强

• make use of Array.prototype.reduce(), which may even give you certain performance boost, compared to destructuring

const obj = {prop1: 1, prop2:2, prop3: 3, prop4: 4, prop5: 5},
      keysToDrop = ['prop2', 'prop3', 'prop4'],
      
      trimmedObj = Object
        .keys(obj)
        .reduce((r,key) => 
          (!keysToDrop.includes(key) && (r[key] = obj[key]), r),{})
      
console.log(trimmedObj)

.as-console-wrapper{min-height:100%;}

这篇关于ES6处理剩余的对象破坏性对象(对象修剪)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！