0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看技术视频
  • 写文章/发帖/加入社区
会员中心
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

鸿蒙TypeScript入门学习第5天:【TypeScript 运算符】

jf_46214456 2024-04-01 16:18 次阅读
加入交流群
微信小助手二维码

扫码添加小助手

加入工程师交流群

1、TypeScript 运算符

运算符用于执行程序代码运算,会针对一个以上操作数项目来进行运算。

考虑以下计算:

7 + 5 = 12复制

以上实例中 7、5 和 12 是操作数。

运算符 + 用于加值。

运算符 = 用于赋值。

TypeScript 主要包含以下几种运算:

  • 算术运算符
  • 逻辑运算符
  • 关系运算符
  • 按位运算符
  • 赋值运算符
  • 三元/条件运算符
  • 字符串运算符
  • 类型运算符

2、算术运算符

假定 y=5 ,下面的表格解释了这些算术运算符的操作:

运算符描述例子x 运算结果y 运算结果
+加法x=y+275
-减法x=y-235
*乘法x=y*2105
/除法x=y/22.55
%取模(余数)x=y%215
++自增x=++y66
x=y++56
--自减x=--y44
x=y--54

实例

使用 tsc 命令编译以上代码得到如下 JavaScript 代码:

var num1 = 10; var num2 = 2; var res = 0; res = num1 + num2; console.log("加: " + res); res = num1 - num2; console.log("减: " + res); res = num1 * num2; console.log("乘: " + res); res = num1 / num2; console.log("除: " + res); res = num1 % num2; console.log("余数: " + res); num1++; console.log("num1 自增运算: " + num1); num2--; console.log("num2 自减运算: " + num2);

执行以上 JavaScript 代码,输出结果为:

加:        12
减: 8
乘:    20
除:   5
余数:   0
num1 自增运算: 11
num2 自减运算: 1

开始前熟悉鸿蒙文档

鸿蒙OS开发更多内容↓点击HarmonyOSOpenHarmony技术
鸿蒙技术文档《鸿蒙NEXT星河版开发学习文档》

搜狗高速浏览器截图20240326151547.png

3、关系运算符

关系运算符用于计算结果是否为 true 或者 false。

x=5,下面的表格解释了关系运算符的操作:

运算符描述比较返回值
==等于x==8false
x==5true
!=不等于x!=8true
>大于x>8false
<小于x<8true
>=大于或等于x>=8false
<=小于或等于x<=8true

实例

var num1:number = 10

var num2:number = 2

var res:number = 0

   

res = num1 + num2

console.log("加:  "+res);

res = num1 - num2;

console.log("减: "+res)

res = num1*num2

console.log("乘:    "+res)

res = num1/num2

console.log("除:   "+res)

   

res = num1%num2

console.log("余数:   "+res)

num1++

console.log("num1 自增运算: "+num1)

num2--

console.log("num2 自减运算: "+num2)复制
var num1:number = 5; var num2:number = 9; console.log("num1 的值为: "+num1); console.log("num2 的值为:"+num2); var res = num1 >num2 console.log("num1 大于n num2: "+res) res = num1< num2 console.log("num1 小于 num2: "+res) res = num1 >=num2 console.log("num1 大于或等于 num2: "+res) res = num1<=num2 console.log("num1 小于或等于 num2: "+res) res = num1==num2 console.log("num1 等于 num2: "+res) res = num1!=num2 console.log("num1 不等于 num2: "+res)复制

使用 tsc 命令编译以上代码得到如下 JavaScript 代码:

var num1 = 5;

var num2 = 9;

console.log("num1 的值为: " + num1);

console.log("num2 的值为:" + num2);

var res = num1  > num2;

console.log("num1 大于n num2: " + res);

res = num1   num2;

console.log("num1 小于 num2: " + res);

res = num1  >= num2; console.log("num1 大于或等于 num2: " + res);

res = num1 <= num2;

console.log("num1 小于或等于 num2: " + res);

res = num1 == num2;

console.log("num1 等于 num2: " + res);

res = num1 != num2;

console.log("num1 不等于 num2: " + res);

执行以上 JavaScript 代码,输出结果为:复制
num1 的值为: 5
num2 的值为:9
num1 大于n num2: false
num1 小于 num2: true
num1 大于或等于  num2: false
num1 小于或等于 num2: true
num1 等于 num2: false
num1 不等于 num2: true复制


4、逻辑运算符

逻辑运算符用于测定变量或值之间的逻辑。

给定 x=6 以及 y=3,下表解释了逻辑运算符:

运算符描述例子
&&and(x < 10 && y > 1) 为 true
!not!(x==y) 为 true

实例

var avg:number = 20;

var percentage:number = 90;

console.log("avg 值为: "+avg+" ,percentage 值为: "+percentage);

var res:boolean = ((avg >50)&&(percentage >80));

console.log("(avg >50)&&(percentage >80): ",res);

var res:boolean = ((avg >50)||(percentage >80));

console.log("(avg >50)||(percentage >80): ",res);

var res:boolean=!((avg >50)&&(percentage >80));

console.log("!((avg >50)&&(percentage >80)): ",res);复制

使用 tsc 命令编译以上代码得到如下 JavaScript 代码:

var avg = 20;

var percentage = 90;

console.log("avg 值为: " + avg + " ,percentage 值为: " + percentage);

var res = ((avg > 50) && (percentage > 80));

console.log("(avg >50)&&(percentage >80): ", res);

var res = ((avg > 50) || (percentage > 80));

console.log("(avg >50)||(percentage >80): ", res);

var res = !((avg > 50) && (percentage > 80));

console.log("!((avg >50)&&(percentage >80)): ", res);复制

执行以上 JavaScript 代码,输出结果为:

avg 值为: 20 ,percentage 值为: 90
(avg >50)&&(percentage >80):  false
(avg >50)||(percentage >80):  true
!((avg >50)&&(percentage >80)):  true复制

5、短路运算符(&& 与 ||)

&& 与 || 运算符可用于组合表达式。 && 运算符只有在左右两个表达式都为 true 时才返回 true。

考虑以下实例:

var a = 10 
var result = ( a< 10 && a >5)复制

以上实例中 a < 10 与 a > 5 是使用了 && 运算符的组合表达式,第一个表达式返回了 false,由于 && 运算需要两个表达式都为 true,所以如果第一个为 false,就不再执行后面的判断(a > 5 跳过计算),直接返回 false。

|| 运算符只要其中一个表达式为 true ,则该组合表达式就会返回 true。

考虑以下实例:

var a = 10 
var result = ( a >5 || a< 10)复制

以上实例中 a > 5 与 a < 10 是使用了 || 运算符的组合表达式,第一个表达式返回了 true,由于 || 组合运算只需要一个表达式为 true,所以如果第一个为 true,就不再执行后面的判断(a < 10 跳过计算),直接返回 true。


6、位运算符

位操作是程序设计中对位模式按位或二进制数的一元和二元操作。

运算符描述例子类似于结果十进制
&AND,按位与处理两个长度相同的二进制数,两个相应的二进位都为 1,该位的结果值才为 1,否则为 0。x = 5 & 10101 & 000100011
OR,按位或处理两个长度相同的二进制数,两个相应的二进位中只要有一个为 1,该位的结果值为 1。x = 510101
~取反,取反是一元运算符,对一个二进制数的每一位执行逻辑反操作。使数字 1 成为 0,0 成为 1。x = ~ 5~01011010-6
^异或,按位异或运算,对等长二进制模式按位或二进制数的每一位执行逻辑异按位或操作。操作的结果是如果某位不同则该位为 1,否则该位为 0。x = 5 ^ 10101 ^ 000101004
<<左移,把 << 左边的运算数的各二进位全部左移若干位,由 << 右边的数指定移动的位数,高位丢弃,低位补 0。x = 5 << 10101 << 1101010
>>右移,把 >> 左边的运算数的各二进位全部右移若干位,>> 右边的数指定移动的位数。x = 5 >> 10101 >> 100102
>>>无符号右移,与有符号右移位类似,除了左边一律使用0 补位。x = 2 >>> 10010 >>> 100011

实例

var a:number = 2; // 二进制 10

var b:number = 3; // 二进制 11

var result; result = (a & b);

console.log("(a & b) = > ",result) result = (a | b);

console.log("(a | b) = > ",result) result = (a ^ b);

console.log("(a ^ b) = > ",result); result = (~b);

console.log("(~b) = > ",result); result = (a   b);

console.log("(a < < b) = > ",result); result = (a  >> b);

console.log("(a > > b) = > ",result); result = (a  >> > 1);

console.log("(a > >> 1) = > ",result);复制

使用 tsc 命令编译以上代码得到如下 JavaScript 代码:

var a = 2; // 二进制 10

var b = 3; // 二进制 11

var result; result = (a & b);

console.log("(a & b) = > ", result); result = (a | b);

console.log("(a | b) = > ", result); result = (a ^ b);

console.log("(a ^ b) = > ", result); result = (~b);

console.log("(~b) = > ", result); result = (a   b);

console.log("(a < < b) = > ", result); result = (a  >> b);

console.log("(a > > b) = > ", result); result = (a  >> > 1);

console.log("(a > >> 1) = > ", result);复制

执行以上 JavaScript 代码,输出结果为:

(a & b) = >  2
(a | b) = >  3
(a ^ b) = >  1
(~b) = >  -4
(a < < b) = >  16
(a > > b) = >  0
(a > >> 1) = >  1
复制

7、赋值运算符

赋值运算符用于给变量赋值。

给定 x=10y=5 ,下面的表格解释了赋值运算符:

运算符例子实例x 值
= (赋值)x = yx = yx = 5
+= (先进行加运算后赋值)x += yx = x + yx = 15
-= (先进行减运算后赋值)x -= yx = x - yx = 5
*= (先进行乘运算后赋值)x *= yx = x * yx = 50
/= (先进行除运算后赋值)x /= yx = x / yx = 2

类似的逻辑运算符也可以与赋值运算符联合使用:<<=, >>=, >>>=, &=, |= 与 ^=。

8、实例

var a: number = 12

var b:number = 10

a = b

console.log("a = b: "+a)

a += b

console.log("a+=b: "+a)

a -= b

console.log("a-=b: "+a)

a *= b

console.log("a*=b: "+a)

a /= b console.log("a/=b: "+a)

a %= b

console.log("a%=b: "+a)复制

使用 tsc 命令编译以上代码得到如下 JavaScript 代码:

var a = 12;

var b = 10;

a = b;

console.log("a = b: " + a);

a += b;

console.log("a+=b: " + a);

a -= b;

console.log("a-=b: " + a);

a *= b;

console.log("a*=b: " + a);

a /= b;

console.log("a/=b: " + a);

a %= b;

console.log("a%=b: " + a);复制

执行以上 JavaScript 代码,输出结果为:

a = b: 10
a+=b: 20
a-=b: 10
a*=b: 100
a/=b: 10
a%=b: 0复制

9、三元运算符 (?)

三元运算有 3 个操作数,并且需要判断布尔表达式的值。该运算符的主要是决定哪个值应该赋值给变量。

Test ? expr1 : expr2复制
  • Test − 指定的条件语句
  • expr1 − 如果条件语句 Test 返回 true 则返回该值
  • expr2 − 如果条件语句 Test 返回 false 则返回该值

让我们看下以下实例:

var num:number = -2 var result = num > 0 ? "大于 0" : "小于 0,或等于 0" console.log(result)复制

实例中用于判断变量是否大于 0。

使用 tsc 命令编译以上代码得到如下 JavaScript 代码:

var num = -2; var result = num > 0 ? "大于 0" : "小于 0,或等于 0"; console.log(result);复制

以上实例输出结果如下:

小于 0,或等于 0复制

10、类型运算符

typeof 运算符

typeof 是一元运算符,返回操作数的数据类型。

查看以下实例:

var num = 12 console.log(typeof num); //输出结果: number

使用 tsc 命令编译以上代码得到如下 JavaScript 代码:

var num = 12; console.log(typeof num); //输出结果: number复制

以上实例输出结果如下:

number复制

11、instanceof

instanceof 运算符用于判断对象是否为指定的类型,后面章节我们会具体介绍它。


12、其他运算符

负号运算符(-)

更改操作数的符号,查看以下实例:

var x:number = 4 var y = -x; console.log("x 值为: ",x); // 输出结果 4 console.log("y 值为: ",y); // 输出结果 -4复制

使用 tsc 命令编译以上代码得到如下 JavaScript 代码:

var x = 4; var y = -x; console.log("x 值为: ", x); // 输出结果 4 console.log("y 值为: ", y); // 输出结果 -4复制

以上实例输出结果如下:

x 值为:  4
y 值为:  -4复制

字符串运算符: 连接运算符 (+)

  • 运算符可以拼接两个字符串,查看以下实例:

var msg:string = "RUNOOB"+".COM" console.log(msg)

使用 tsc 命令编译以上代码得到如下 JavaScript 代码:

var msg = "RUNOOB" + ".COM"; console.log(msg);

以上实例输出结果如下:

RUNOOB.COM
声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • 鸿蒙系统
    +关注

    关注

    183

    文章

    2642

    浏览量

    70239
  • 鸿蒙
    +关注

    关注

    60

    文章

    3058

    浏览量

    46265
  • HarmonyOS
    +关注

    关注

    80

    文章

    2157

    浏览量

    36402
  • OpenHarmony
    +关注

    关注

    33

    文章

    3983

    浏览量

    21458
  • 鸿蒙OS
    +关注

    关注

    0

    文章

    194

    浏览量

    5581
收藏 人收藏
加入交流群
微信小助手二维码

扫码添加小助手

加入工程师交流群

    评论

    相关推荐
    热点推荐

    Vue3 + React18 + TS4入门到实战 系统学习3大热门技术 | 更新完结

    Vue3 + React18 + TS4入门到实战 系统学习3大热门技术 | 更新完结 前端技术升级:Vue3新特性+React18并发+TS4类型精讲 前端开发领域正经历着一场深刻的技术变革
    发表于 03-30 15:18

    鸿蒙生态·星光学堂鸿蒙应用开发者培训1期(长沙)成功举办!政企协同共育鸿蒙人才,助力区域数字产业

    1月9日,鸿蒙生态·星光学堂——鸿蒙应用开发者培训1期在长沙经开区正式开班。本次培训在长沙经开区管委会党建工作局的指导下,由鸿蒙生态(长沙)创新中心主办,
    的头像 发表于 01-12 18:03 635次阅读
    <b class='flag-5'>鸿蒙</b>生态·星光学堂<b class='flag-5'>鸿蒙</b>应用开发者培训<b class='flag-5'>第</b>1期(长沙)成功举办!政企协同共育<b class='flag-5'>鸿蒙</b>人才,助力区域数字产业

    C语言主要特点

    ,源程序短,因此输入程序时工作量少。 2.运算符丰富,C语言的运算符包含的范围很广泛,共有34种运算符。C语言把括号、赋值和强制类型转换等都作为运算符处理,从而使C语言的
    发表于 01-05 07:41

    cw32f030c8实现点灯

    GPIOA->ODR |= (1 << 1); 这行代码使用按位或运算符(|)设置GPIOA的ODR寄存器的1位。在这种情况下,我们要求1位(对应
    发表于 12-10 08:07

    C语言宏拼接运算符典型使用

    在C语言中,##运算符(称为[size=16.002px]标记拼接运算符)用于宏定义中将两个标记(token)拼接成一个新的标记。它在预处理阶段处理,常用于动态生成变量名、函数名或类型名,以提高代码
    发表于 11-20 08:27

    4章 C语言基础以及流水灯的实现(4.3 4.4)

    4.3 C语言基本运算符 小学数学学过加、减、乘、除等运算符号以及四则混合运算,而这些运算符号在C语言中也有,但是有些表达方法不一样,并且还有额外的
    的头像 发表于 10-29 15:30 479次阅读

    学习物联网怎么入门?

    景等。同时,学习物联网的基本技术,如传感器技术、通信技术、云计算等,也是非常重要的。 其次,选择适合自己的学习方式也是入门学习物联网的重要一步。
    发表于 10-14 10:34

    什么是5G技术(5代)

    什么是5G技术(5代)
    的头像 发表于 08-27 11:53 1315次阅读
    什么是<b class='flag-5'>5</b>G技术(<b class='flag-5'>第</b><b class='flag-5'>5</b>代)

    【HarmonyOS 5鸿蒙星闪NearLink详解

    【HarmonyOS 5鸿蒙星闪NearLink详解 ##鸿蒙开发能力 ##HarmonyOS SDK应用服务##鸿蒙金融类应用 (金融理财# 一、前言
    的头像 发表于 07-11 18:24 2165次阅读
    【HarmonyOS <b class='flag-5'>5</b>】<b class='flag-5'>鸿蒙</b>星闪NearLink详解

    【HarmonyOS 5鸿蒙mPaaS详解

    【HarmonyOS 5鸿蒙mPaaS详解 ##鸿蒙开发能力 ##HarmonyOS SDK应用服务##鸿蒙金融类应用 (金融理财# 一、mPaaS是什么? mPaaS 是 Mobi
    的头像 发表于 07-11 18:23 1093次阅读
    【HarmonyOS <b class='flag-5'>5</b>】<b class='flag-5'>鸿蒙</b>mPaaS详解

    【HarmonyOS 5】金融应用开发鸿蒙组件实践

    【HarmonyOS 5】金融应用开发鸿蒙组件实践 ##鸿蒙开发能力 ##HarmonyOS SDK应用服务##鸿蒙金融类应用 (金融理财# 一、鸿
    的头像 发表于 07-11 18:20 1204次阅读
    【HarmonyOS <b class='flag-5'>5</b>】金融应用开发<b class='flag-5'>鸿蒙</b>组件实践

    【 HarmonyOS 5 入门系列 】鸿蒙HarmonyOS示例项目讲解

    【 HarmonyOS 5 入门系列 】鸿蒙HarmonyOS示例项目讲解 ##鸿蒙开发能力 ##HarmonyOS SDK应用服务##鸿蒙
    的头像 发表于 07-07 11:57 1261次阅读
    【 HarmonyOS <b class='flag-5'>5</b> <b class='flag-5'>入门</b>系列 】<b class='flag-5'>鸿蒙</b>HarmonyOS示例项目讲解

    C语言精彩编程百例-364页

    内容提要 C是一种通用的程序设计语言,它包含了紧凑的表达式、丰富的运算符集合、现代控制流以及数据结构等四个部分。C语言功能丰富,衣达能力强,使用起来灵活方便:它应用面广,可移植性强,网时具有高级语言
    发表于 06-13 17:28

    鸿蒙5开发宝藏案例分享---性能体验设计

    ?** 鸿蒙性能优化宝藏指南:让你的应用丝滑如飞!** 大家好呀!最近在HarmonyOS文档里挖到一个性能优化的\"黄金矿脉\"——官方其实藏了超多流畅性设计的实战案例!但很多
    发表于 06-12 16:45

    华为推出首款搭载HarmonyOS 5鸿蒙电脑

    近日,华为正式发布搭载基于开源鸿蒙5.0.2 Release版本打造的全新HarmonyOS 5鸿蒙电脑HUAWEI MateBook Pro与HUAWEI MateBook Fold非凡大师
    的头像 发表于 05-26 09:28 2332次阅读