【JavaScript 09】算术运算符 加法运算符 连接运算符 对象相加 valueOf方法 toString方法 余数运算符 Math.abs() 自增自减运算符 副作用 数值运算符 指数 赋值


运算符是 处理数据的基本方法

算术运算符

JS提供10种算术运算符

  1. 加法运算符 x + y
  2. 减法运算符 x - y
  3. 乘法运算符 x * y
  4. 除法运算符 x / y
  5. 指数运算符 x ** y
  6. 余数运算符 x % y
  7. 自增运算符 x++
  8. 自减运算符 x–
  9. 数值运算符 +x
  10. 负数运算符 -x

加法运算符

基本规则

求两个数值的和
JS允许非数值相加

1 + 1 // 2
true + true // 2
1 + true // 2

比较特殊的是如果是两个字符串相加,这时加法运算符会变成连接运算符,返回一个新的字符串
如果一个运算子是字符串,另一个运算子是非字符串,这时非字符串会转成字符串,再连接在一起

'a' + 'bc' // 'abc'
1 + 'abc' // '1abc'
true + 'abc' // 'trueabc'

加法运算符是在运行时决定是执行相加还是执行连接
也即由于运算子的不同导致了不同的语法行为,是为加法运算符重载overload

由于从左到右的运算次序(左结合性)
字符串位置不同将会导致不同的运算结果

'3' + 4 + 5 // '345'
3 + 4 + '5' // '75'

减法、除法和乘法不会发生重载
其规则是所有运算子一律转为数值,再进行相应的数学运算

1 - '2' // -1
1 * '2' // 2
1 / '2' // 0.5

对象相加

如果运算子是对象,必须先转成原始类型的值(先valueOf方法转成对象,后toString方法转成字符串),然后再相加

var obj = { p: 1 };
obj + 2 // '[object Object]2'

对象转成原始类型的值de规则如下

  1. 自动调用对象的valueOf方法
  2. 而后自动调用对象的toString方法将其转为字符串
var obj = { p: 1};
obj.valueOf() // { p: 1 }
obj.valueOf().toString() // "[object Object]"

一般对象的valueOf方法总是返回对象自身

因此可以自定义valueOf方法或toString方法得到想要的结果

var obj = {
	valueOf: function () {
		return 1;
	}
};

obj + 2 // 3

这个例子中由于valueOf方法直接返回一个原始类型的值,所以不再调用toString方法

还有自定义toString方法

var obj = {
	toString: function () {
		return 'hello';
	}
};

obj + 2 // "hello2"

上面代码中对象obj的toString方法返回字符串hello
只要有一个运算子是字符串,加法运算符就变成连接运算符,返回连接后的字符串

但是有特例若运算子是Date对象的实例,则会优先执行toString方法,而后便不再执行valueOf方法

var obj = new Date();
obj.valueOf = function () { return 1 };
obj.toString = function () { return 'hello' };

obj + 2 // 'hello2'

上面代码中对象obj是一个Date对象的实例,并且自定义了valueOf方法和toString方法,结果toString方法优先执行

余数运算符

余数运算符%返回前运算子被后运算子除后所得的余数
注意运算结果的正负由第一个运算子的正负决定

12 % 5 // 2

-1 % 2 // -1
1 % -2 // 1

因此当需要得到负数的正确余数值时可以使用绝对值函数

// 错误写法
function isOdd(n) {
	return n % 2 === 1;
}
isOdd(-5) // false
isOdd(-4) // false

// 正确写法
function isOdd(n) {
	return Math.abs(n % 2) === 1;
}
isOdd(-5) // true
isOdd(-4) // false

余数运算符还可以用于浮点数的运算
但是由于浮点数不是精确的值,无法得到完全准确的结果

6.5 % 2.1
// 0.19999999999999973

自增自减运算符

自增和自减运算符,是一元运算符,只需要一个运算子
作用是将运算子首先转为数值,然后加上1或者减去1
会修改原始变量

var x = 1;
++x // 2
x // 2

--x // 1
x // 1

运算之后,变量的值发生变化,这种效应叫做运算的副作用(side effect)
这是自增自减运算符独有的
同样需要注意当自增/自减运算符放置在变量之后则会先返回变量操作前的值,而后进行自增/自减操作,放在之前则相反

var x = 1;
var y = 1;

x++ // 1
++y // 2

数值与负数值运算符

数值运算符作用是可以将任何值转为数值(同Number函数作用)

+true // 1
+[] // 0
+{} // NaN

上面代码表示,非数值经过数值运算符以后,都变成了数值(最后一行NaN也是数值)

负数值运算符(-),也同样具有将一个值转为数值的功能,只不过得到的值正负相反
连用两个负数值运算符,等同于数值运算符

数值运算符号和负数值运算符,都会返回一个新的值,而不会改变原始变量的值

指数运算符

注意指数运算符是右结合

// 相当于 2 ** (3 ** 2)
2 ** 3 ** 2
// 512

赋值运算符

Assignment Operators 用于给变量赋值

var x = 1;

var x = y;

// 算术运算符
x += y // 同 x = x + y
x -= y // 同 x = x - y
x *= y // 同 x = x * y
x /= y // 同 x = x / y
x %= y // 同 x = x % y
x **= y // 同 x = x ** y

// 位运算符
x >>= y // 同 x = x >> y
x <<= y // 同  x = x << y
x >>>= y // 同 x = x >>> y
x &= y // 同 x = x & y
x |= y // 同 x = x | y
x ^= y // 同 x = x ^ y

复合的赋值运算符是先进行指定运算,然后将得到值返回给左边的变量

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Zanebla

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值