首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

函数中的Getters和Setters (javascript)

在JavaScript中,Getters和Setters是一种特殊的函数,用于访问对象的属性。它们允许您定义对象属性的访问方式,使得可以对属性进行更灵活的控制和验证。

Getters函数用于获取属性的值,它没有参数,并返回属性的值。当您尝试访问对象的属性时,会自动调用该Getter函数。例如,假设有一个名为"age"的属性:

代码语言:txt
复制
const person = {
  age: 25,
  get ageValue() {
    return this.age;
  }
};

console.log(person.ageValue); // 输出: 25

上述代码中,通过定义名为ageValue的Getter函数,我们可以使用person.ageValue来获取person对象的age属性。

Setters函数用于设置属性的值,它接收一个参数,并将该参数值赋给属性。当您尝试设置对象的属性时,会自动调用该Setter函数。例如,假设有一个名为"age"的属性:

代码语言:txt
复制
const person = {
  _age: 25,
  set ageValue(newAge) {
    if (newAge >= 0) {
      this._age = newAge;
    } else {
      console.log("年龄不能为负数!");
    }
  }
};

person.ageValue = 30; // 设置年龄为30
console.log(person.ageValue); // 输出: 30

person.ageValue = -5; // 尝试设置年龄为负数
// 输出: 年龄不能为负数!

上述代码中,通过定义名为ageValue的Setter函数,我们可以使用person.ageValue = 30来设置person对象的age属性。在Setter函数中,我们可以进行额外的逻辑验证,例如确保年龄不为负数。

Getters和Setters可以用于各种场景,例如:

  • 数据验证和过滤:您可以在Setter函数中添加验证逻辑,确保设置的值符合特定条件。
  • 计算属性:Getter函数可以基于其他属性的值计算并返回新的属性值。
  • 对象访问控制:通过使用Getters和Setters,您可以对对象的属性进行更严格的控制和隐藏。

腾讯云相关产品和产品介绍链接地址:

  • 云函数(Serverless云函数计算):云函数是腾讯云提供的一种事件驱动的无服务器计算服务。通过云函数,您可以部署和运行自己的代码,而无需关心服务器的管理和维护。了解更多:https://cloud.tencent.com/product/scf
  • 云数据库MySQL版(TencentDB for MySQL):腾讯云的云数据库MySQL版是一种稳定可靠、可弹性伸缩的关系型数据库服务,提供高性能的数据库存储和管理。了解更多:https://cloud.tencent.com/product/cdb_mysql
  • 云服务器(CVM):腾讯云的云服务器是一种弹性计算服务,提供了高性能、高可靠性的计算资源,可以用于部署和运行各种应用程序。了解更多:https://cloud.tencent.com/product/cvm
页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

JavaScriptcompose函数pipe函数

compose函数 compose函数可以将需要嵌套执行函数平铺,嵌套执行就是一个函数返回值将作为另一个函数参数。...res = calculate(10); console.log(res); // 200 但是根据我们之前讲函数式编程,我们可以将复杂几个步骤拆成几个简单可复用简单步骤,于是我们拆出了一个加法函数一个乘法函数...累加器接收四个参数,第一个是上次计算值,第二个是数组的当前值,主要用就是这两个参数,后面两个参数不常用,他们是当前index当前迭代数组: const arr = [[1, 2], [3, 4]...compose实现,webpackloader加载顺序也是从右往左,这是因为他也是compose实现。...pipe函数 pipe函数跟compose函数作用是一样,也是将参数平铺,只不过他顺序是从左往右。

1.5K22
  • 10 - JavaScript 函数 & 11 - JavaScript 函数种类

    原文地址:https://dev.to/bhagatparwinder/functions-in-javascript-5ehm 什么是函数?它在 JavaScript 扮演什么角色?...函数就是 JavaScript 可以被执行代码块。函数有如下必备部分: 1. 使用 function 关键字声明; 2. 函数名字紧跟其后,它就是被调用时使用名字。 3....JavaScript 自带函数 你不是要经常写函数JavaScript 自带了许多可以直接使用方法。...函数声明在其他代码执行之前被加载,然而函数表达式只有等到 JavaScript 解释器执行到所在代码行时才被加载。这就是 JavaScript hoisting[1] 原理。...IIFE (立即执行函数) IIFE 是一个声明执行同时发生函数。通过匿名函数小括号来创建,然后通过在其后增加一个小括号调用。

    2.8K20

    Javascript函数声明函数表达式

    Javascript有很多有趣用法,在Google Code Search里能找到不少,举一个例子: ~function() { alert("hello, world.")...; }(); 试一下就知道这段代码意思就是声明一个函数,然后立刻执行,因为Javascript变量作用域是基于函数,所以这样可以避免变量污染,但这里位运算符『~』乍一看让人摸不到头脑...在阐述为什么之前,让我们先来明确Javascript两个概念:函数声明函数表达式: 先来看看什么样函数声明: function() { alert("hello, world...,Javascript不允许在函数声明后面直接使用小括号,而函数表达式则没有这个限制,通过在函数声明前面加上一个『~』操作符,就可以让语法解析器把后面看成是函数表达式,同样,在函数声明前面加上『!...,+,-』等操作符也是可行。 那我们为什么不使用下面这种函数表达式方式呢?

    56520

    盘点JavaScriptgetter()setter()函数使用

    它们本质上是用于获取设置值函数,但从外部代码来看就像常规属性。 二、Getter setter 访问器属性由 “getter” “setter” 方法表示。...在对象字面量,它们用 get set表示: let obj = { get propName() { // 当读取 obj.propName 时,getter 起作用 }, set...这就是访问器属性设计思想。不以函数方式 调用 user.fullName,正常 读取 它:getter 在幕后运行。 截至目前,fullName只有一个 getter。...例: 如果想禁止太短 user name,可以创建一个 setter name,并将值存储在一个单独属性 _name: let user = { get name() { return...六、总结 本文基于JavaScript基础,介绍了getter setter函数使用。对于其中属性,通过案例样式,运行效果图展示,进行详细讲解。

    1.6K11

    JavaScript函数this(二)

    this 常见用途:访问对象属性方法:通过使用 this,我们可以在对象方法访问操作对象属性方法。...创建和初始化对象:通过构造函数 this,我们可以在创建对象时设置初始化对象属性。...console.log(john.name); // 输出 "John"console.log(john.age); // 输出 25修改执行上下文:通过使用 call() 或 apply(),我们可以在特定上下文中调用函数...避免闭包问题:通过使用 this,我们可以避免闭包作用域问题,确保访问正确变量对象。...需要注意是,this 值在函数被调用时确定,并且在函数执行过程可能会发生变化。了解 this 规则用法非常重要,以避免在代码中出现错误或意外行为。

    50910

    JavaScript函数this(一)

    JavaScript,关键字 this 是一个特殊对象引用,它指向当前执行函数上下文对象。this值在函数被调用时确定,并且可能根据函数调用方式上下文不同而变化。...this使用是非常重要,它允许我们访问操作当前执行函数所属对象环境。...console.log(this); // 输出全局对象,如 window 对象(在浏览器环境函数 this:在函数内部,this 值取决于函数被调用方式。...箭头函数 this:箭头函数 this 值是在定义时确定,它捕获了包含它函数 this 值。...(箭头函数捕获了 sayHello() this 值)this 使用非常重要,它允许我们访问操作当前执行函数所属对象环境。

    59820

    JavaScript高阶函数

    在《javascript设计模式开发实践》是这样定义: 1.函数可以作为参数被传递; 2.函数可以作为返回值输出。...示例 Array.prototype.map 该map()方法通过调用作为输入数组每个元素参数提供回调函数来创建一个新数组。...该map()方法将从回调函数获取每个返回值,并使用这些值创建一个新数组。传递给回调函数map()方法接受3个参数:element,index,array。...假设我们有一个数组,我们想要创建一个新数组,其中包含第一个数组每个值两倍。让我们看看如何使用不使用高阶函数来解决问题。...高阶函数就像常规函数一样,具有接收返回其他函数附加能力,即参数输出。

    1.2K20

    JavaScript函数基础

    函数能让开发者把JavaScript代码变得更有效率,而且更能重复吃用。函数解决思路:把大问题变成小问题,分割思路。...返回值能让你从函数返回一段数据。...前端开发原则一: 结构(html),样式(css)行为(JavaScript)分离。 内容:网页HTML代码,它提供网页实际上如何拼接在一起结构,同时也是网页数据所在地。...外观:网页css代码,它主要改变内容样式,决定字体,色彩排版最终效果。 功能:驱动网页、带来交互性JavaScript代码。...引用函数调用函数差别,可以通过查看函数名称后面是否跟随了括号()。引用函数只会单独出现,但调用函数一定有括号,有时还带有参数。

    1.5K60

    JavaScript箭头函数

    JavaScript箭头函数随着ECMAScript 2015发布而到来,也被称为ES6。由于其简洁语法对this关键字处理,箭头函数迅速成为开发者们最喜爱功能。...关键字 没有大括号{} 在JavaScript函数是一等公民。...你可以把函数存储在变量,把它们作为参数传递给其他函数,并从其他函数把它们作为值返回。你可以使用JavaScript箭头函数来做所有这些事情。 无圆括号语法 在上述示例函数是没有参数。...,以解决JavaScriptthis关键字绑定问题。...箭头函数在数组方法也很好用,如.map()、.sort()、.forEach()、.filter()、.reduce()。但请记住:箭头函数并不能取代常规JavaScript函数

    2.1K20

    JavaScript 函数式编程:函数,组合柯里化

    面向对象编程函数式编程是两种非常不同编程范式,它们有自己规则优缺点。 ...高阶函数意味着函数不仅仅是一个可以从代码定义调用,实际上,你可以将它们用作可分配实体。如果你使用过一些JavaScript,那么这并不奇怪。将匿名函数分配给常量,这样事情非常常见。 ...(mapdouble),因此你不必担心了解它们工作原理。...第二,我们已经有了一个加 10 函数 add10 一个乘以 5 函数 mult5 ,所以这里我们就在写已经重复代码了。 ...暂时先不管这个,毕竟我们现在用JavaScript。一旦使用函数式语言,任何东西都是不可变

    97130

    JavaScript 函数式编程:函数,组合柯里化

    面向对象编程函数式编程是两种非常不同编程范式,它们有自己规则优缺点。...高阶函数意味着函数不仅仅是一个可以从代码定义调用,实际上,你可以将它们用作可分配实体。如果你使用过一些JavaScript,那么这并不奇怪。将匿名函数分配给常量,这样事情非常常见。...(mapdouble),因此你不必担心了解它们工作原理。...第二,我们已经有了一个加 10 函数 add10 一个乘以 5 函数 mult5 ,所以这里我们就在写已经重复代码了。...暂时先不管这个,毕竟我们现在用JavaScript。一旦使用函数式语言,任何东西都是不可变

    1.5K10

    JavaScript匿名函数困惑

    函数字面量(function literal):处理事件无名函数(nameless function)。函数字面量有时也称为匿名函数(anonymous function)。...可以在onload事件完成所有事件初始化。 函数字面量最好只被调用一次,而且不是被开发者写程序代码调用。创建一个函数字面量并直接指派给一个元素事件属性,而不是创建有名称函数并指派到它引用。...如果在代码不需要函数引用时,为了编写程序效率,同时不想中规中矩为函数命名,函数字面量(匿名函数)才显得有必要。 匿名函数调用: 调用一个函数,必须有方法定位它,找到它。...匿名函数生命周期window.onload有内在关系吗?...参考资料: 匿名函数闭包http://blog.csdn.net/natineprince/article/details/4759533

    1.2K70

    javascript函数声明函数表达式浅析

    在ECMAScript,有两个最常用创建函数对象方法,即使用函数表达式或者使用函数声明。...// 声明,因为它是函数体(FunctionBody)一部分 })(); 还有一种情况: (function foo(){}) 这种情况也是函数表达式,它被包含在一对圆括号函数,在其上下文环境...——译 }  函数声明与函数表达式异同 下面简单说说。声明表达式行为存在着十分微妙而又十分重要差别。 首先,函数声明会在任何表达式被解析求值之前先行被解析求值。...即使声明位于源代码最后一行,它也会先于同一作用域中位于最前面的表达式被求值。还是看个例子更容易理解。在下面这个例子函数 fn 是在 alert 后面声明。...函数声明只能出现在“程序代码”,意味着只能在其它函数或者全局空间;它们定义不能不能赋值给一个变量或属性,或者作为一个参数传递出现在函数调用;下面的例子是函数声明允许用法,foo(),bar

    93290
    领券