首页 > 编程语言 > javaScript操作符

javaScript操作符

时间:2023-08-11 11:01:32浏览次数:35  
标签:逻辑 age javaScript 运算符 num 操作符 递增 表达式

1运算符

运算符(operator)也被称为操作符,是用于实现赋值、比较和执行算数运算等功能的符号。

  • JavaScript中常用的运算有:
  • 算数运算符
  • 递增和递减运算符
  • 比较运算符
  • 逻运算符
  • 赋值运算符

2 算术运算符

2.1 算术运算符的概述

概念:算术运算符使用的符号,用于执行两个变量或值的算术运算。

运算符

描述

实例

+

10+20=30

-

10 - 2- = -10

*

10* 20 = 200

/

10 / 20 = 0.5

%

取余数(取模)

返回除法的余数9 % 2 = 1

2.2 浮点数的精度问题

浮点数值的最高精度是17位小数,但在进行算术计算时其精确度远远不如整数。

var result = 0.1 + 0.2;   // 结果不是 0.3,而是:0.30000000000000004
console.log(0.07 * 100);  // 结果不是 7,而是:7.000000000000001

所以,不要直接判断两个浮点数是否相等!

2.3 课堂提问
  1. 我们怎么判断一个数能够被整除呢 ? 它的余数是0就说明这个数能被整除,这就是 % 取余运算符的主要用途
  2. 请问1+2*3结果是? 结果是7,注意算术运算符优先级的,先乘除,后加减,有小括号先算小括号里面的
2.4 表达式和返回值

表达式:是由数字、运算符、变量等以能求得数值的有意义排列方法所得的组合

简单理解:是由数字、运算符、变量等组成的式子

表达式最终都会有一个结果,返回给我们,我们成为返回值


3 递增和递减运算符

3.1 递增和递减运算符的概述

如果需要反复给数字变量添加或减去1,可以使用递增( ++) 和递减( -- ) 运算符来完成

在JavaScript中,递增( ++)和递减( -- )既可以放在变量前面,也可以放在变量后面。放在变量前面时我们可以称为前置递增(递减)运算符,放在变量后面时,我们可以称为后置递增( 递减)运算符

注意:递增和递减运算符必须和变量配合使用。

3.2 递增运算符
3.2.1 前置递增运算符

++num 前置递增,就是自加1,类似于num = num + 1,但是++num写起来更简单。

使用口诀:先自加,后返回值

3.2.2 后置递增运算符

num++后置递增,就是自加1,类似于num = num + 1;但是,num + 1写起来更简单,

使用口诀:先返回原值,后自加

3.3 前置递增和后置递增小结
  • 前置递增和后置递增运算符可以简化代码的编写,让变量的值+1 比以前写法更简单
  • 单独使用时,运行结果相同
  • 与其他代码联用时,执行结果会不同
  • 后置:先原值运算,后自加(先人后己 )
  • 前置: 先自加,后运算( 先已后人 )
  • 开发时,大多使用后置递增并且代码独占一行,例如:num++;或者num--:

4 比较运算符

4.1 比较运算符概述

概念:比较运算符(关系运算符)是两个数据进行比较时所用的运算符,比较运算后,会返回一个布尔类型的值(true/false)作为比较的运算的结果。

运算符名称

说明

案例

结果

<

小于号

1<2

true

>

大于号

1>2

false

>=

大于等于号(大于或者等于)

2 >= 2

true

<=

小于等于号(小于或者等于)

3 <= 2

false

==

判等号 (会转型)

37 == 37

true

!=

不等号

37 != 37

false

=== !==

全等 要求值和数据类型都一致

37 === '37'

false

4.2 =小结

符号

作用

用法

=

赋值

把右边给左边

==

判断

判断两边的值是否相等(注意此时有隐式转换)

===

全等

判断两边的值和数据类型是否完全一致


5 逻辑运算符

5.1 逻辑运算符的概述

概念:逻辑运算符用来进行布尔值运算的运算符,其返回的值也是布尔类型的值.后面开发中经常用于多个条件的判断.

逻辑运算符

说明

案例

&&

"逻辑与",简称"与" and

true && false

||

"逻辑或",'"简称" "或" or

true || false

!

"逻辑非", 简称"非" not

!true

5.2 逻辑与 &&

                                           javaScript操作符_运算符

5.3 逻辑或 ||

                                           javaScript操作符_运算符_02

5.3 逻辑非 !

                                           javaScript操作符_运算符_03

5.4 短路运算(逻辑中断)

短路运算的原理:当有多个表达式(值时,左边的表达式值可以确定结果时,就不再继续运算右边的表达式的值

1.逻辑与

  • 语法:  达式1 && 表达式2
  • 如果第一个表达式的值为真,则返回表达式2
  • 如果第一个表达式的值为假,则返回表达式1

2.逻辑或

  • 语法: 表达式1] 表达式2
  • 如果第一个表达式的值为真,则返回表达式1
  • 如果第一个表达式的值为假,则返回表达式2
console.log( 123 || 456 ); //123
console.log(0 || 456 );// 456
console.log( 123 || 456 || 789 ); // 123
var num = 0;
console.log(123 || num++);
console.log(num); //0

6 赋值运算符

概念:用来把数据赋值给变量的运算符。

赋值运算符

说明

案例

=

直接赋值

var usrName =''我是值'';

+=,-=

加、减 一个数 后在赋值

var age = 10; age+=5; // 15

*= 、/+ 、%=

乘、除、取模 后在赋值

var age = 2; age*=5; // 10

var age = 10;
age += 5; // 相当于 age = age + 5;
age -= 5; // 相当于 age = age - 5;
age *= 10; // 相当于 age = age * 10

7 运算符优先级

优先级

运算符

程序

1

小括号

()

2

一元运算符

++ -- !

3

算数运算符

先 */ 后 +-

4

关系运算符

> >= < <=

5

相等运算符

== != === !==

6

逻辑运算符

先&& 后 ||

7

赋值运算符

=

8

逗号运算符

,

  • 一元运算符里面的逻辑非优先级很高
  • 逻辑与比逻辑或优先级高




标签:逻辑,age,javaScript,运算符,num,操作符,递增,表达式
From: https://blog.51cto.com/u_15912723/7044621

相关文章

  • Javascript学习笔记-js实现拷贝复制功能
    /***复制单行内容到粘贴板*content:需要复制的内容*message:复制完后的提示,不传则默认提示"复制成功"*/functioncopyToClip(content,message){varaux=document.createElement("input");aux.setAttribute("value"......
  • 如何使用原生 JavaScript Canvas API 实现视频中的绿幕背景替换功能 All In One
    如何使用原生JavaScriptCanvasAPI实现视频中的绿幕背景替换功能AllInOneCanvas&Videodemoschroma-keying/greenscreeneffectconstprocessor={};processor.doLoad=functiondoLoad(){constvideo=document.getElementById("video");this.vid......
  • 【JavaScript36】HTML DOM创建/插入/删除/替换元素
    createElement创建元素document.createElement()可以创建一个元素document.createTextNode()创建一个文本节点appendChild()方法可向节点的子节点列表的末尾添加新的子节点。<divid="demo"><pid="p1">这是文本内容</p></div><script>//div下添加一个子元......
  • 【JavaScript34】获取和修改属性节点
    根据W3C的HTMLDOM标准,HTML文档中的所有内容都是节点:整个文档是一个文档节点每个HTML元素是元素节点HTML元素内的文本是文本节点每个HTML属性是属性节点注释是注释节点属性节点比如有一个p标签元素节点<pid="p2"class="text-center">点我看看</p>-那......
  • 【JavaScript35】innerText 和 innerHTML
    获取内容时innerHTML从对象的起始位置到终止位置的全部内容,还包括HTML标签。innerText会去掉标签的内容。innerText和innerHTML获取内容示例<divid="demo"><pid="p1"><strong>这是文本内容</strong></p>helloworld!</div><script>......
  • DWR、Java 和 Dojo 工具箱集成 Java 和 JavaScript
    2008年8月29日您能很快地说出多少Java™Web开发框架、库和工具箱?没错,数量太多,以至于很难弄清楚它们各自的功能以及哪个功能可以真正帮助您解决问题。但是,如果您从事的是Ajax开发,那么您必须要知道这个库:DirectWebRemoting(DWR)。它利用Java语言和JavaWeb技术大大......
  • javascript学习二
     文献1ECMAScript基础2对象基础javascript到底是基于对象还是面向对象?使用预定义的对象:创建新对象:继承机制3浏览器中的javascript3.1用<script></script>标签,将javascript引入html3.2Svg3.3BOMBrowserObejctModel4DOM基础关于sax和dom的区别:DOM的常识CoreDOM:HTMLDOMDOM一......
  • JavaScript访问者模式:优雅地遍历对象
    JavaScript访问者模式JavaScript中的访问者模式是一种优雅的设计模式,它可以帮助我们遍历对象并执行特定操作。在本文中,我们将介绍访问者模式的概念、实现方式以及一个简单的示例。什么是访问者模式?访问者模式是一种行为型设计模式,它允许我们在不改变对象结构的情况下,定义新的操......
  • JavaScript常用校验类方法
    #前端常用校验类工具方法#邮箱exportconstisEmail=(s)=>{return/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/.test(s)}123#手机号码exportconstisMobile=(s)=>{return/^1[0-9]{10}$/.test(s)}123#电话号码e......
  • 【JavaScript31】HTML DOM节点与节点属性
    前言DOM(DocumentObjectModel)文档对象模型,通过HTMLDOM,JavaScript能够访问和改变HTML文档的所有元素。当网页被加载时,浏览器会创建页面的文档对象模型(DocumentObjectModel)。HTMLDOM模型被结构化为对象树:DOM节点根据W3C的HTMLDOM标准,HTML文档中的所有内......