0

0

JavaScript中getter与setter访问器属性的编写标准

冷漠man

冷漠man

发布时间:2026-03-16 23:21:01

|

238人浏览过

|

来源于php中文网

原创

JavaScript中getter/setter应语义清晰、行为可控、避免副作用,仅用于计算、校验、拦截或兼容场景;命名与普通属性一致,不加get/set前缀;getter无参且必有确定返回值,setter单参用于校验赋值;推荐class语法集中定义,配合Symbol或下划线私有字段管理状态。

javascript中getter与setter访问器属性的编写标准

JavaScript中getter与setter的编写应遵循语义清晰、行为可控、避免副作用三大原则,不是所有属性都适合用访问器,只有在需要计算、校验、拦截或兼容旧接口时才使用。

命名需与普通属性一致,不加get/set前缀

访问器属性名应和它所代表的逻辑属性保持一致,不要写成getUserNamesetAge。JS引擎会自动识别user.name触发getter,user.name = 'xxx'触发setter。

  • ✅ 正确:Object.defineProperty(obj, 'fullName', { get() { return this.first + ' ' + this.last; } })
  • ❌ 错误:getFullName——这只是一个普通方法,不是访问器

getter必须有返回值,且不能有参数

getter函数签名必须是空括号get() {},不可接受任何参数。若需传参,应改用普通方法。返回值应是确定的、无副作用的表达式结果。

  • ✅ 合理:计算派生值(如area基于widthheight)、格式化输出(如isoDate
  • ❌ 危险:发起网络请求、修改状态、触发DOM操作——这些会让属性读取变得不可预测

setter必须接收且仅接收一个参数,用于赋值校验与转换

setter形参名无强制要求,但建议语义化(如valuenewName)。内部应对输入做必要检查,并只更新受控的内部状态(常配合私有字段或Symbol键)。

AdsGo AI
AdsGo AI

全自动 AI 广告专家,助您在数分钟内完成广告搭建、优化及扩量

下载

立即学习Java免费学习笔记(深入)”;

  • ✅ 推荐模式:用Symbol或下划线前缀字段存储真实值,如this._email,getter/setter对外提供校验后的email
  • ✅ 示例:setter中对邮箱格式正则校验,非法值可抛错或静默忽略
  • ❌ 避免:setter里调用saveToServer()this.render()

优先使用class语法,保持定义集中、可读性强

ES6 class中的getter/setter更简洁,且天然支持继承与重写。相比Object.defineProperty分散定义,class块内声明更易维护。

  • ✅ 推荐写法:
class Person {
  constructor(first, last) {
    this._first = first;
    this._last = last;
  }
  get fullName() {
    return `${this._first} ${this._last}`;
  }
  set fullName(value) {
    const parts = value.split(' ');
    this._first = parts[0] || '';
    this._last = parts.slice(1).join(' ') || '';
  }
}
  • ⚠️ 注意:class中无法直接用defineProperty添加访问器;若需动态定义,仍需回到对象API

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

WorkBuddy
WorkBuddy

腾讯云推出的AI原生桌面智能体工作台

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
es6新特性
es6新特性

es6新特性有:1、块级作用域变量;2、箭头函数;3、模板字符串;4、解构赋值;5、默认参数;6、 扩展运算符;7、 类和继承;8、Promise。本专题为大家提供es6新特性的相关的文章、下载、课程内容,供大家免费下载体验。

106

2023.07.17

es6新特性有哪些
es6新特性有哪些

es6的新特性有:1、块级作用域;2、箭头函数;3、解构赋值;4、默认参数;5、扩展运算符;6、模板字符串;7、类和模块;8、迭代器和生成器;9、Promise对象;10、模块化导入和导出等等。本专题为大家提供es6新特性的相关的文章、下载、课程内容,供大家免费下载体验。

197

2023.08.04

JavaScript ES6新特性
JavaScript ES6新特性

ES6是JavaScript的根本性升级,引入let/const实现块级作用域、箭头函数解决this绑定问题、解构赋值与模板字符串简化数据处理、对象简写与模块化提升代码可读性与组织性。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

234

2025.12.24

硬盘接口类型介绍
硬盘接口类型介绍

硬盘接口类型有IDE、SATA、SCSI、Fibre Channel、USB、eSATA、mSATA、PCIe等等。详细介绍:1、IDE接口是一种并行接口,主要用于连接硬盘和光驱等设备,它主要有两种类型:ATA和ATAPI,IDE接口已经逐渐被SATA接口;2、SATA接口是一种串行接口,相较于IDE接口,它具有更高的传输速度、更低的功耗和更小的体积;3、SCSI接口等等。

2005

2023.10.19

PHP接口编写教程
PHP接口编写教程

本专题整合了PHP接口编写教程,阅读专题下面的文章了解更多详细内容。

681

2025.10.17

php8.4实现接口限流的教程
php8.4实现接口限流的教程

PHP8.4本身不内置限流功能,需借助Redis(令牌桶)或Swoole(漏桶)实现;文件锁因I/O瓶颈、无跨机共享、秒级精度等缺陷不适用高并发场景。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

2440

2025.12.29

java接口相关教程
java接口相关教程

本专题整合了java接口相关内容,阅读专题下面的文章了解更多详细内容。

49

2026.01.19

class在c语言中的意思
class在c语言中的意思

在C语言中,"class" 是一个关键字,用于定义一个类。想了解更多class的相关内容,可以阅读本专题下面的文章。

931

2024.01.03

chatgpt使用指南
chatgpt使用指南

本专题整合了chatgpt使用教程、新手使用说明等等相关内容,阅读专题下面的文章了解更多详细内容。

0

2026.03.16

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
React 教程
React 教程

共58课时 | 6.1万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 3.5万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 3.6万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号