关闭

js 中实现getter和setter函数方法,及运算符的特殊用法

时间: 2018-12-27阅读: 1240标签: 函数

1.getter与setter

JavaScript的大部分东西是简化了的。这里我们假设有一个student对象,并且我们用student.age来访问它的age属性,如果此时定义了age属性,我们就会得到它的值,如果没有,我们就会得到undefined。

但是我们也可以编写自定义的getter和setter函数来获取我们的想要的东西,而不是直接返回对象的值,设置值的时候也是一样。这样我们就可以实现更多复杂的获取和设置字段的功能,如虚拟字段,字段验证,副作用等,ES6中添加了更加方便的语法形式。

  • getter简单说来就是一种获得属性值的方法,setter简单说来就是一种设置属性值的方法
  • getter负责查询值,它不带任何参数,setter则负责设置键值,值是以参数的形式在内部传递。

//isNaN() 函数用来确定一个值是否为NaN ,即判断该值是否为一个非数字。

const student = {
    firstName: 'job',
    lastName: 'jark',

    get fullName() {
        return this.firstName + ' ' + this.lastName;
    },

    set age(value) {
        if (isNaN(value)) throw Error("It has been a bumber");
        this_age = Number(value)
    },
    get age() {
        return this_age
    }
};
console.log(student.firstName);
student.firstName = 'jerry';
console.log(student.fullName);
student.age = '21';
console.log(student.age);
student.age = 'error';

2.运算符

 1.逗号运算符

通常逗号运算符用于在一行编写多个语句,或者在for循环中使用,比如

var a,b,n = 6;
for(a = 0,b = 0;a <= n&&b<=n;a++,b++) {
}
function  calculate() {
    return a++,console.log(a),a;
}

我们还可以用它在一行中编写有逗号分隔的多个表达式,,并返回最后一个表达式的结果。

//通过var定义的变量,作用域是整个封闭函数,是全域的 。通过let定义的变量,作用域是在块级或是子块中。

let result = number1,number2,...,numberN;


2.!!运算符

他的效果与使用两次的js否定运算符的作用是一致的。!!是将任何表达式转化为布尔类型的表达式的相对较优的运算符。

同样的,如果表达式的返回值为真值,则返回true,否则则返回false。

!!null         //returns false
!!undefined   //returns false
!!false        //returns false
!!true         //returns true 
!!""           //returns false
!!"somestring" //returns true
!!0        //returns false
!!1        //returns true
!![]        //returns true
!!{}        //returns true

3.+运算符

+运算符能够快速的将字符串转化为数字,只需要在字符串前面加上+号即可,+运算符还适用于负数,八进制,十六进制和指数,可以将date或者Moment.js对象转化为时间戳。

//时间戳(timestamp),一个能表示一份数据在某个特定时间之前已经存在的、 完整的、 可验证的数据,通常是一个字符序列,唯一地标识某一刻的时间。

+ '3.11'     //returns 3.11
+ '-4'        //returns -4
+ '0xFF'      //returns 255
+ true        //returns 1
+ '123e-5'   //returns 0.00123
+ false      //returns 0
+ null        //returns 0
+ 'Infinity' //returns Infinity
+'1,234'     //returns Nan
+dateObject   //returns 1542975502981
+momentObject //returns 1542975502981


4.~运算符

位运算符一般使用的很少,当他与数字一起使用的时候,比如~N => -(N+1),这个式子仅当 N == -1 的时候结果为0。

我们可以在indexof(..)函数前面加一个~来进行布尔检查,检查一个项是否存在于Array或者string中。

let userName = 'break jerry'

if(~userName.indexOf("break")) {
    console.log('access denied');
}else {
    console.log('access granted');
}

来自:https://www.cnblogs.com/cyk2018/archive/2018/12/26/10181527.html


站长推荐

1.云服务推荐: 国内主流云服务商,各类云产品的最新活动,优惠券领取。地址:阿里云腾讯云华为云

2.广告联盟: 整理了目前主流的广告联盟平台,如果你有流量,可以作为参考选择适合你的平台点击进入

链接: http://www.fly63.com/article/detial/1707

关闭

理解JavaScript Call()函数原理

对于 fn1.call(fn2);我能够理解,这段代码仅仅 使得 fn1对象的this指向了fn2;但是最终不影响fn1函数的执行。因为fn1中不包含对this的操作。不过 fn1.call.call(fn2);实在是令我费解

Js函数的扩展

篇文章主要介绍了函数的扩展,函数的扩展只要有三个方面:参数的默认值,箭头函数.关于尾调用的优化;1:参数的默认值(会形成一个单独的作用域)

浅谈JavaScript的防抖与节流

在前端开发的过程中,我们经常会需要绑定一些持续触发的事件,如 resize、scroll、mousemove 等等,但有些时候我们并不希望在事件持续触发的过程中那么频繁地去执行函数。这时候就用到防抖与节流。

Vue源码中用到的工具函数

以下摘取的函数,在 shared 目录下公用的工具方法。提取了一些常用通用的函数进行剖析,主要包含以下内容创建一个被冻结的空对象:判断是否是 undefined 或 null,判断是否不是 undefined 和 null

js声明函数

JS声明函数的三种方式:函数表达式: function操作符创建函数, 表达式可以存储在变量或者对象属性里. 往往被称为匿名函数, console.log(h.name); 可以看到打印为空;函数声明: 具名函数, 且函数能在其所在作用域的任意位置被调用

javascript封装函数

使用函数有两步:1、定义函数,又叫声明函数, 封装函数。2、调用函数var 变量 = 函数名(实参);对函数的参数和返回值的理解

Js中的compose函数和pipe函数

compose函数可以将需要嵌套执行的函数平铺,嵌套执行就是一个函数的返回值将作为另一个函数的参数。我们考虑一个简单的需求:

前端js常用的时间函数整理

有很多用到了时间函数,报错直接获取本月的开始日期,结束如期。本周的开始时间,结束时间等。这里简单的记录一下,方便下次引用。时间格式大家可以自行修改

关于Javascript中的valueOf与toString

以上引申出对象数据的转换的问题:所有对象继承了两个转换方法:toString(): 它的作用是返回一个反映这个对象的字符串,valueOf():它的作用是返回它相应的原始值

注入eval, Function等系统函数,截获动态代码

现在很多网站都上了各种前端反爬手段,无论手段如何,最重要的是要把包含反爬手段的前端javascript代码加密隐藏起来,然后在运行时实时解密动态执行。动态执行js代码无非两种方法,即eval和Function。

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!