×

this.setData({id})和this.setData({id:id})有什么区别?

作者:Terry2026.02.09来源:Web前端之家浏览:25评论:0
关键词:变量名

this.setData({id})和this.setData({id:id})有什么区别?

微信小程序中,这两种写法在功能上是完全等价的,都会将id变量的值设置到data中的id属性。

详细解释:

1. this.setData({id})

// es6+ 的对象简写语法
// 等价于 {id: id}
this.setData({id})

这是ES6对象属性简写写法,当属性名和变量名相同时可以这样简写。

2. this.setData({id:id})

// 传统的对象写法
this.setData({id:id})

这是标准的对象字面量写法。

实际示例:

Page({
  data: {},
  
  onload() {
    const id = 123;
    
    // 两种写法效果完全相同
    this.setData({id});        // ES6简写
    this.setData({id: id});    // 传统写法
    
    // 最终都会得到:data: {id: 123}
  }
})

区别总结:

特性{id}{id:id}
语法版本ES6+es5+
可读性更简洁更明确
功能完全一样完全一样
编译后会被转译为{id:id}保持不变

使用建议:

  1. 简洁场景:变量名和data属性名一致时,推荐使用{id}(更简洁)

  2. 清晰场景:如果想让代码更易读,或者团队习惯,可以使用{id:id}

  3. 不同名场景:当变量名和属性名不同时,必须使用完整写法:

const userId = 123;
this.setData({id: userId});  // 必须完整写法

性能、功能、效果上两者没有任何区别,选择哪种主要取决于个人或团队的编码风格偏好。

您的支持是我们创作的动力!
温馨提示:本文作者系Terry ,经Web前端之家编辑修改或补充,转载请注明出处和本文链接:
https://www.jiangweishan.com/article/bialinsdfsdgj235sdf.html

网友评论文明上网理性发言 已有0人参与

发表评论: