这一节我们来学习typescript中的运算符。学完typescript中的运算符之后,要求我们能够掌握运算符的使用。
1. 运算符概述
如果你在这之前学习过其他的语言,例如Java、PHP、JavaScript等,那么你对运算符应该很了解了。没学过也不要紧,运算符就类似于我们经常用到的加减乘除等。
运算符也称为操作符,用来实现赋值(=)、算术运算、比较等功能的符号。
常用的运算符有:
- 算术运算符 。加减乘除呀,这我们已经知道了。
- 赋值运算符 。赋值运算符我们在前面已经用过了,当然我们一会还会看一下。
- 递增/递减运算符 。这个在我们学习typescript到现在还没用过,待会也会详细讲解。
- 比较运算符 。比较就是大于呀,小于呀,我们也要做了解的。
- 逻辑运算符
当然,不同运算符可以实现不同功能,接下来我们就一一介绍。
2. 算术运算符
2.1 概述
首先是算术运算符,算术运算符包含:加(+)、减(-)、乘(*)、除(/)。 它是进行算术运算时使用的符号,用于两个数值之间的计算。
接下来我们到代码中去体验一下:
// 加
console.log(1 + 2) // 3
// 减
console.log(2 - 1) // 1
// 乘
console.log(2 * 3) // 6
// 除
console.log(4 / 2) // 2
2.2 加号的其他作用
注意:+ 号,不仅可以用于加法计算,还能实现字符串拼接。 我们到代码中体验一下:
// 字符串拼接(拼串)
console.log('周杰' + '伦') // 结果为:'周杰伦'
我们思考一个问题:既然**+**号能用于加法计算,又能实现字符串拼接,那它是什么时候做加分,什么时候做字符串拼接的呢?
我们来看一段代码:
console.log(1 + 2) // 结果为:3
console.log(1 + '2') // 结果为:'12'
console.log('1' + 2) // 结果为:'12'
从代码的运行结果可以看出:加号两边只要有一边是字符串,就执行字符串拼接。
2.3 加号引发的思考
我们思考一下:既然加号可以跟字符串一起使用,那其他算术运算符(- * /)可以吗? 我们可以检验一下:
console.log(2 - '1')
当我们敲完以上代码,就会发现代码报错了:提示算术运算符的右侧必须是数字类型。
于是,我们得出结论:除加号以外,其他算术运算符只应该跟数字类型一起使用。
那如果我们就想实现2 - ‘1’ 呢?有其他方法吗?答案是有的。我们可以将字符串类型转换为数字类型。 在前面我们学习typescript数据类型时讲过:number数据类型还包括正数跟负数,正号(+)是可以省略的。在这里,我们可以给字符串 ‘1’ 前面加上一个 + 号,表示 ‘1’(string) 转换 1(number)。下面我们到代码中验证一下:
console.log(2 - +'1')
此时代码没有报错,运行结果为:1
记住:在字符串前面添加 + 号,可以将 string 转化为 number(字符串内容为数字时才有意义)
3. 赋值运算符
我们接着来讲解赋值运算符,赋值运算符在前面我们用了很多次了,就是将等号右边的值赋值给它左边的变量,比如:等号(=)。
下面我们来看一句代码:
let age: number = 18
这句代码的意思是:将等号右侧的 18 赋值给等号左侧的变量 age 。这句代码执行之后,age变量的值为18。现在我们有这样一个需求:明年小明 19 岁,让变量 age 变成 19。我们可以:
age = age + 1
这句代码的执行顺序是:先执行等号右边的代码,age + 1 计算结果为19; 再将计算结果19赋值给等号左边的变量age,所以代码执行后age变量的值为19。
除了等号(=)之外,赋值运算符还包括:加等(+=)、减等(-=)、乘等(=)、除等(/=*)。
我们来看一下用 加等(+=)怎么改写 代码 age = age + 1
age += 1
以上代码与 age = age + 1 的执行结果是一样的。其他几个(减等、乘等、除等)同理。
4. 自增和自减运算符
自增(++)运算符是 += 1 的简化形式;自减(–)运算符是 -= 1 的简化形式。 当我们想要实现变量 加一 或者 减一 的功能时,就可以使用这种简化形式。
比如,我们每过一年都增加一岁,该如何处理? 我们可以按照前面学习的赋值运算符写:
age += 1 // 加等
现在我们有了 ++ 这种更简洁的方式,可以写成
age++
我们来解释一下这种写法:age**++** 会让变量 age 的值加 1。
这两种写法都是可以的,代码的运行结果也是一样的。
自增和自减有什么作用呢?自增(++)运算符用来实现变量的值加 1;自减(–)运算符实现变量的值减 1。
注意:++ 或 –,只能让变量的值增加或减少 1。
5. 比较运算符
生活中,我们经常会用到“比较”。比如,考完试,拿到成绩后,你会跟你的同桌比较分数。
你的100分 大于 同桌的99分
很明显,以上比较的是100>99,肯定是正确的。如果是99>100,结果就是错的。所以比较运算符是用于比较两个数据的值,并返回其比较的结果,结果为布尔类型。
比较运算符包含 6 个:
- 大于(>)
- 大于等于(>=)
- 小于(<)
- 小于等于(<=)
- 等于(===)
- 不等于(!==)
下面我们通过代码来理解比较运算符:
// 大于
console.log(1 > 2)
// 大于等于
console.log(3 >= 2)
// 小于
console.log(1 < 2)
// 小于等于
console.log(3 <= 2)
代码的运行结果为:
false
true
true
false
这应该不难理解,接下来我们来看一下等于(=)和不等于(!)
如果我们直接写:
// 相等
console.log(3 === 4)
// 不相等
console.log(3 !== 4)
这时候代码会报错,报错提示3永远不会等于4,第一句代码输出结果永远是false。同样3永远不等于4,第二句代码输出结果永远是true。我们的typescript很智能的告诉我们,这样的代码没什么意义。
那我们怎么验证**等于(=)和不等于(!)**呢?其实只要将字面量改为变量就不会报错了:
let num1: number = 3
let num2: number = 4
// 相等
console.log(num1 === num2) // false
// 不相等
console.log(num1 !== num2) // true
最后我们通过问题来总结一下比较运算符:
问题1:比较运算符有什么用?比较两个数据的值
问题2:比较结果是什么类型? 布尔类型
注意:比较运算符常用于数字类型的比较。
6. 逻辑运算符
逻辑运算符包括:与(&&)、或(||)、非(!)
生活中,我们常用:并且、或者、不是 这样的词语,来描述一些事情。比如,我们找对象的时候,一开始希望找一个 有钱 并且 漂亮( 两个条件同时满足 )。过了一段时间没找到对象,你降低了择偶标准, 有钱 或者 漂亮 ( 只要某一个条件满足 )就可以了。 最后实在没办法,只要 不是 男的( 取反 )就行了。
这个例子与逻辑运算符对应:与(并且)、或(或者)、非(不是)。 是否满足条件,结果不是 是 就是 否 。逻辑运算符通常用于布尔类型的计算,并且结果也是布尔类型。
与(逻辑与),用 && 符号来表示。当 && 两边的值同时为true,结果才为true;否则,为false。
true && false // 结果为:false示例:
// 与 console.log(2 > 1 && 2 >= 2) // 结果为:true或(逻辑或),用 || 符号来表示。当 || 两边的值只要有一个为true,结果就为true;否则,为false。
true || false // 结果为:true示例:
// 或 console.log(3 < 2 || 1 <= 2) // 结果为:true非(逻辑非),符号为 !(叹号),表示取反,即:true 取反后为 false 而 false 取反后为 true。
!true // 结果为:false示例:
// 非 console.log(!false || false) // 结果为:true
总结:
两个条件同时满足时,再执行操作,使用 逻辑与 &&
只要有一个条件满足时,就执行操作,使用 逻辑或 ||
逻辑非,表示 取反 !