当前位置:首页 > JavaScript

js实现getter

2026-02-01 00:34:57JavaScript

JavaScript 实现 Getter

在 JavaScript 中,Getter 是一种特殊的对象属性访问器,用于在访问属性时执行自定义逻辑。Getter 通常与 Setter 配对使用,但也可以单独定义。

使用对象字面量定义 Getter

在对象字面量中,可以通过 get 关键字定义 Getter:

js实现getter

const obj = {
  _value: 42,
  get value() {
    return this._value;
  }
};

console.log(obj.value); // 输出: 42

使用 Object.defineProperty 定义 Getter

通过 Object.defineProperty 方法可以在现有对象上动态添加 Getter:

const obj = { _value: 42 };

Object.defineProperty(obj, 'value', {
  get: function() {
    return this._value;
  },
  enumerable: true,
  configurable: true
});

console.log(obj.value); // 输出: 42

在类中定义 Getter

在 ES6 类中,Getter 可以像普通方法一样定义:

js实现getter

class MyClass {
  constructor() {
    this._value = 42;
  }

  get value() {
    return this._value;
  }
}

const instance = new MyClass();
console.log(instance.value); // 输出: 42

Getter 计算属性

Getter 可以用于动态计算属性值:

const circle = {
  radius: 10,
  get diameter() {
    return this.radius * 2;
  }
};

console.log(circle.diameter); // 输出: 20

Getter 的注意事项

Getter 不能接受参数,如果尝试传递参数会报错。如果需要参数化访问,应该使用方法而不是 Getter。

Getter 常用于封装内部状态,提供更安全的访问方式,或者在访问属性时执行额外逻辑(如日志记录、验证等)。

标签: jsgetter
分享给朋友:

相关文章

js实现列表

js实现列表

使用 JavaScript 实现列表 JavaScript 提供了多种方式来实现列表功能,包括数组操作、DOM 元素动态生成等。以下是几种常见的实现方法: 使用数组存储列表数据 数组是 JavaSc…

js实现祖玛

js实现祖玛

实现祖玛游戏的核心思路 祖玛游戏的核心玩法是发射彩色珠子,形成三个或以上相同颜色的珠子即可消除。以下是使用JavaScript实现的基本框架。 游戏初始化 创建画布并初始化游戏状态: const…

js画图实现

js画图实现

使用Canvas API绘制图形 Canvas是HTML5提供的绘图API,通过JavaScript操作Canvas元素可以绘制各种图形。以下是一个简单的示例: <canvas id="myC…

js实现目录

js实现目录

实现目录的基本思路 在JavaScript中实现目录功能通常涉及以下几个核心步骤:解析文档中的标题元素(如h1-h6),动态生成目录结构,并添加交互逻辑(如点击跳转)。以下是具体实现方法: 解析标题…

js钟表实现

js钟表实现

实现JavaScript钟表的基本方法 创建一个简单的JavaScript钟表可以通过以下步骤完成,涵盖数字和模拟两种形式。 数字钟表实现 HTML结构只需一个显示时间的容器: <div i…

js节流实现

js节流实现

节流的概念 节流(Throttle)是一种限制函数执行频率的技术,确保函数在一定时间间隔内只执行一次。常用于滚动事件、窗口调整等高频触发的场景。 基础实现方法 使用时间戳判断是否执行函数: fun…