直接密钥访问和对象解构之间的性能

时间:2017-12-27 09:13:01

标签: javascript reactjs

下面最有效的代码是什么。

代码1

const {
  type,
  size,
} = props;

console.log(type);

代码2 *

console.log(props.type);

我在一篇文章中读到,当您读取对象下方的键值对时,会对性能产生影响。我知道访问一个级别不会对性能产生巨大影响。但我想从上面的代码示例(代码1和代码2)中了解哪些内容会更快更有效。

2 个答案:

答案 0 :(得分:2)

如果你看到破坏部分的转换代码,你会发现正在设置一个新变量。

例如:

const {
  type,
  size,
} = props;

转换为

var type_1 = props.type; // dummy_name
var size_1 = props.size;

因此,正在设置一个额外的变量并且内存消耗相对较高。但是,性能差异非常小。

答案 1 :(得分:1)

在这种情况下肯定是第二个选项 (在这种情况下严格来说)

在某些情况下,如果为了某种可读性而提高效率,那么您将有所牺牲,这对于大多数人来说很容易判断。

看到性能差异很小,但是确实存在。

enter image description here

URL:https://jsperf.com/destructuring-performance