JavaScript 语法:运算符号

简介: JavaScript 语法 之 运算符号

作者:WangMin
格言:努力做好自己喜欢的每一件事

1.jpg

JavaScript要进行各种各样的运算,就要使用不同的运算符号。

JavaScript 算数运算符

算数运算符用于对数字执行算数运算,分别有以下几种:

运算符 描述
+ 加法
- 减法
* 乘法
/ 除法
% 系数
++ 递加
-- 递减

1、+、-、*、/ 这四种算数运算符跟数学中的运算方式是一致的,如下:

var a=5+2;
var b=6-3;
var c=9*2;
var d=10/2;
console.log(a,b,c,d);//7 3 18 5

对于运算符 + 需要注意的是:

  • 对非Number(字符串除外)的值进行加运算时会先将其转换成Number型在运算,注意任何值和NaN运算都是NaN,案例如下:

    var a=1+null;
    var b=1+NaN;
    var c=true+false;                                                              
    var d=true+4;
    console.log(a,b,c,d);//1 NaN 1 5
    
  • 对于含有字符串类型的相加运算则看成连字符,将左右两边连接起来组成一个字符串,从左向右连接,案例如下:

    var a=5+'你好,明天';
    console.log(a);//5你好,明天
    

    注意:任何数据和 “字符串”相加都会连接到一起转换为字符串。

对于运算符 - 需要注意的是:

  • 对非Number的值进行减运算时会先将其转换成Number型在运算,注意任何值和NaN运算都是NaN,案例如下:
    var a=5-'2';
    var b=1-0;
    var c=6-true;                                                              
    var d=true-false;
    var e=1-'ni';
    console.log(a,b,c,d,e);//3 1 5 1 NaN
    
    2、"%" 取余运算符,两个数相除,不是数学中的除号是取余,就是取运算的余数,所得的结果为余数。如果余数为0,则两个数能除尽;如果余数不为0,则两个不能整除。案例如下:
    var a=6%5;
    console.log(a);//1
    var b=10%5;
    console.log(b);//0
    
    3、"++" 加1运算符、自增1。
    1)"++"作前缀(++i)时,例如:
    var a=2,b;
    b=++a;
    console.log(a,b);//3,3
    
    输出结果是a=3,b=3,我们可以看出前置++(++i)是先加1在使用

2)作为后缀(i++)时,例如

var a=2,b;
b=a++;
console.log(a,b);//3,2

输出结果是a=3,b=2,我们可以看出后置++(i++)是先使用再加1

4、"--"减1运算符,自减1(情况与运算符 "++" 差不多)
1)"--"作前缀(--i)时,例如:

var a=2,b;
b=--a;
console.log(a,b);//1,1

输出结果是a=1,b=1,我们可以看出前置--(--i)是先减1在使用

2)作为后缀(i--)时,例如

var a=2,b;
b=a--;
console.log(a,b);//1,2

输出结果是a=1,b=2,我们可以看出后置--(i--)是先使用再减1

JavaScript 赋值运算符

赋值运算符向 JavaScript 变量赋值。分别有以下几种:

运算符 例子 等同于
= x = y 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

以上为变量表达式的几种简写方式。例如:

var a=2;
a+=2;
console.log(a);//4

根据上面提供的赋值运算符,我们还可以将上面的例子写为如下格式,效果一致,如下:

var a=2;
a=a+2;
console.log(a);//4

我们常用的变量表达式为第一种简写方式,这样的好处是代码执行性能好。其他几种赋值运算符和上面的例子是一个道理。

JavaScript 比较运算符

比较运算符的运算结果是布尔值(true或false)。

运算符 描述
== 等于
=== 等值等型
!= 不相等
!== 不等值或不等型
> 大于
< 小于
>= 大于或等于
<= 小于或等于
? 三元运算符

1、">"、"<"、">="、"<=" 判断两个值之间的大小关系

通过关系运算符可以判断两个值之间的大小关系,如果关系成立则返回true如果关系不成立则返回false。对于非数值比较时会先转换成数字(数值型)在比较。任何值和NaN比较都返回false。特别注意如果两边都是字符串,则是按照字符编码进行比较。案例如下:

var a=5>4;
console.log(a);//true
var b=5<4;
console.log(b);//false
var c=5>true;
console.log(c);//true
var d=5>null;
console.log(d);//true
var e=5>NaN;
console.log(e);//false
var a1=5>=4;
console.log(a1);//true
var b1=5<=4;
console.log(b1);//false
var d1=5>=false;
console.log(d1);//true
var e1=5<=NaN;
console.log(e1);//false
var a2=5>"hello";
console.log(a2);//false
var d2="11"<"5";
console.log(d2);//true

2、\=\= 等于、!= 不等于、\=\=\= 全等、!== 不全等

1)"\=\=" 等于:只比较两个变量的值,而不管其数据类型。只要值一样,就返回true,否则返回false。例子如下:

var a=2=="2";
console.log(a);//true
var b=2=="10";
console.log(b);//false
var c=2==true;
console.log(c);//false
var d="2"=="2";
console.log(d);//true
var a1=null==undefined;
console.log(a1);//true

2)!= 不等于 与 \=\= 等于一致。例子如下:

var a=2!="2";
console.log(a);//false
var b=2!="10";
console.log(b);//true
var c=2!=true;
console.log(c);//true
var d="2"!="2";
console.log(d);//false
var a1=null!=undefined;
console.log(a1);//false

3) "===" 全等于。既比较变量,也判断其数据类型。如果类型和值都一样,返回true,否则返回false。例子如下:

var a=2==="2";
console.log(a);//false
var b=2==="10";
console.log(b);//false
var c=2===true;
console.log(c);//false
var d="2"==="2";
console.log(d);//true
var a1=null===undefined;
console.log(a1);//false

4)!== 不全等与 \=\=\= 全等等于一致。例子如下:

var a=2!=="2";
console.log(a);//true
var b=2!=="10";
console.log(b);//true
var c=2!==true;
console.log(c);//true
var d="2"!=="2";
console.log(d);//false
var a1=null!==undefined;
console.log(a1);//true

注意:NaN不和任何值相等包括它自己。

3、"?" 三元运算符
格式:条件表达式 ?语句1:语句2;
执行流程:先算条件表达式,若条件表达式为真则执行语句1,并返回执行结果。如果条件表达式为假false,则执行语句2,并返回执行结果。如果条件表达式的值是非布尔值则会转换成布尔值。案例如下:

var a=20,b=10;
var c=a>b?a:b;
console.log(c);

注意: 其实三元运算符,就是if else的变形形式。

JavaScript 逻辑运算符

逻辑运算符的运算结果有两个true或false。

&& : 逻辑与
|| : 逻辑或
! : 逻辑非

1)"&&" 逻辑与(并且关系)。如果左右两个操作数都为true,就是两个条件同时满足时,则结果为true,否则,结果为false。案例如下:

var a=true&&false;
console.log(a);//false
var b=1<2&&2<3;
console.log(b);//true

逻辑&&运算如果两个条件都为true则输出结果是第二个条件的结果,如果第一个是false则输出结果是第一个条件的结果。案例如下:

var a=1&&2;
console.log(a);//2

var b=0&&2;
console.log(b);//0

2)"||" 逻辑或。左右两个条件,只要有一个满足,则返回true,否则,返回false。案例如下:

var a=true||false;
console.log(a);//true
var b=1<2||2<3;
console.log(b);//true

逻辑||运算如果第一个是true则输出结果是第一个条件的结果,如果第一个是false则输出是第二个条件的结果。案例如下:

var a=3||2;
console.log(a);//3

var a=0||2;
console.log(a);//2

3)"!" 取反运算。当条件为真,在条件前面添加"!",此时整体就为假了,案例如下:

var a=!true;
console.log(a);//false
var b=!100;
console.log(b);//false

以上仅是个人见解,若有不足之处欢迎在下方评论指出,那就先分享到这里!! :smile: 后续继续更新!!

目录
相关文章
|
1月前
|
JavaScript 前端开发
JS浮点数精度问题及高精度小数运算:BigNumber解决方案
JS浮点数精度问题及高精度小数运算:BigNumber解决方案
140 0
|
3月前
|
存储 JavaScript 前端开发
Node.js的基本语法
【8月更文挑战第12天】Node.js的基本语法
128 1
|
29天前
|
JavaScript 前端开发
JavaScript 函数语法
JavaScript 函数是使用 `function` 关键词定义的代码块,可在调用时执行特定任务。函数可以无参或带参,参数用于传递值并在函数内部使用。函数调用可在事件触发时进行,如用户点击按钮。JavaScript 对大小写敏感,函数名和关键词必须严格匹配。示例中展示了如何通过不同参数调用函数以生成不同的输出。
|
1月前
|
JavaScript 前端开发 大数据
在JavaScript中,Object.assign()方法或展开语法(...)来合并对象,Object.freeze()方法来冻结对象,防止对象被修改
在JavaScript中,Object.assign()方法或展开语法(...)来合并对象,Object.freeze()方法来冻结对象,防止对象被修改
18 0
|
1月前
|
前端开发 JavaScript 安全
前端JS实现密码校验键盘横竖、26字母、相同字母、相同数字、密码包含用户名、数字 字母不能连续 不能相同三个、不能横向 竖向 连续三个 包含字符、不能有中文符号
该 JavaScript 代码实现了一个严格的密码校验功能,确保密码满足多种安全要求,包括长度、字符类型、不包含中文及特殊字符、不与用户名相似等。通过多个辅助函数,如 `validateFormat` 检查密码格式,`isHasChinaCharFun` 检测中文符号,`getCharAll` 生成键盘组合,以及 `checkPasswordFun` 综合验证密码的有效性和安全性。此工具对于提高用户账户的安全性非常有用。
31 0
|
3月前
|
JavaScript 前端开发
JavaScript基础&实战(1)js的基本语法、标识符、数据类型
这篇文章是JavaScript基础与实战教程的第一部分,涵盖了JavaScript的基本语法、标识符、数据类型以及如何进行强制类型转换,通过代码示例介绍了JS的输出语句、编写位置和数据类型转换方法。
JavaScript基础&实战(1)js的基本语法、标识符、数据类型
用html+javascript打造公文一键排版系统14:为半角和全角字符相互转换功能增加英文字母、阿拉伯数字、标点符号、空格选项
用html+javascript打造公文一键排版系统14:为半角和全角字符相互转换功能增加英文字母、阿拉伯数字、标点符号、空格选项
|
2月前
|
JavaScript 前端开发
今天被JavaScript的String型和数字型的+运算撞了一下腰。
今天被JavaScript的String型和数字型的+运算撞了一下腰。
|
3月前
|
前端开发 JavaScript 程序员
前端 JavaScript 的 _ 语法是个什么鬼?
前端 JavaScript 的 _ 语法是个什么鬼?
|
4月前
|
缓存 JavaScript 前端开发
前端框架与库 - Vue.js基础:模板语法、数据绑定
【7月更文挑战第14天】Vue.js 是渐进式框架,以简洁API和高效数据绑定知名。本文聚焦模板语法与数据绑定,解释常见问题和易错点,助力初学者避坑。模板语法中,{{ expression }} 用于渲染值,v-bind/: 用于动态绑定属性。数据绑定涉及文本、属性和事件,注意v-model适用于表单元素,计算属性有缓存。理解正确用法,借助文档和IDE,可提升开发质量和效率。善用Vue.js,打造响应式UI。
140 4