js基础知识汇总03
2024-06-08 03:50:04
逻辑运算符01
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script type="text/javascript">/** JS中为我们提供了三种逻辑运算符* ! 非* - !可以用来对一个值进行非运算* - 所谓非运算就是值对一个布尔值进行取反操作，* true变false，false变true* - 如果对一个值进行两次取反，它不会变化* - 如果对非布尔值进行元素，则会将其转换为布尔值，然后再取反* 所以我们可以利用该特点，来将一个其他的数据类型转换为布尔值* 可以为一个任意数据类型取两次反，来将其转换为布尔值，* 原理和Boolean()函数一样* * && 与* - &&可以对符号两侧的值进行与运算并返回结果* - 运算规则* - 两个值中只要有一个值为false就返回false，* 只有两个值都为true时，才会返回true* - JS中的“与”属于短路的与，* 如果第一个值为false，则不会看第二个值* * || 或* - ||可以对符号两侧的值进行或运算并返回结果* - 运算规则：* - 两个值中只要有一个true，就返回true* 如果两个值都为false，才返回false* - JS中的“或”属于短路的或* 如果第一个值为true，则不会检查第二个值*///如果两个值都是true则返回truevar result = true && true;//只要有一个false，就返回falseresult = true && false;result = false && true;result = false && false;//console.log("result = "+result);//第一个值为true，会检查第二个值//true && alert("看我出不出来！！");//第一个值为false，不会检查第二个值//false && alert("看我出不出来！！");//两个都是false，则返回falseresult = false || false;//只有有一个true，就返回trueresult = true || false;result = false || true ;result = true || true ;//console.log("result = "+result);//第一个值为false，则会检查第二个值//false || alert("123");//第一个值为true，则不再检查第二个值//true || alert("123");var a = false;//对a进行非运算a = !a;//console.log("a = "+a);var b = 10;b = !!b;//console.log("b = "+b);//console.log(typeof b);</script></head><body></body>
</html>逻辑运算符02
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script type="text/javascript">/** && || 非布尔值的情况* - 对于非布尔值进行与或运算时，* 会先将其转换为布尔值，然后再运算，并且返回原值* - 与运算：* - 如果第一个值为true，则必然返回第二个值* - 如果第一个值为false，则直接返回第一个值* * - 或运算* - 如果第一个值为true，则直接返回第一个值* - 如果第一个值为false，则返回第二个值* *///true && true//与运算：如果两个值都为true，则返回后边的var result = 5 && 6;//与运算：如果两个值中有false，则返回靠前的false//false && trueresult = 0 && 2;result = 2 && 0;//false && falseresult = NaN && 0;result = 0 && NaN;//true || true//如果第一个值为true，则直接返回第一个值result = 2 || 1;result = 2 || NaN;result = 2 || 0;//如果第一个值为false，则直接返回第二个值result = NaN || 1;result = NaN || 0;result = "" || "hello";result = -1 || "你好";console.log("result = "+result);</script></head><body></body>
</html>赋值运算符
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script type="text/javascript">/** =* 可以将符号右侧的值赋值给符号左侧的变量* += * a += 5 等价于 a = a + 5* -=* a -= 5 等价于 a = a - 5* *=* a *= 5 等价于 a = a * 5* /=* a /= 5 等价于 a = a / 5* %=* a %= 5 等价于 a = a % 5* */var a = 10;//a = a + 5;//a += 5;//a -= 5;//a *= 5;// a = a%3;a %= 3;console.log("a = "+a);</script></head><body></body>
</html>关系运算符
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script type="text/javascript">/** 通过关系运算符可以比较两个值之间的大小关系，* 如果关系成立它会返回true，如果关系不成立则返回false* * > 大于号* - 判断符号左侧的值是否大于右侧的值* - 如果关系成立，返回true，如果关系不成立则返回false* * >= 大于等于* - 判断符号左侧的值是否大于或等于右侧的值* * < 小于号* <= 小于等于* * 非数值的情况* - 对于非数值进行比较时，会将其转换为数字然后在比较* - 如果符号两侧的值都是字符串时，不会将其转换为数字进行比较* 而会分别比较字符串中字符的Unicode编码*/var result = 5 > 10;//falseresult = 5 > 4; //trueresult = 5 > 5; //falseresult = 5 >= 5; //trueresult = 5 >= 4; //trueresult = 5 < 4; //falseresult = 4 <= 4; //true//console.log("result = "+result);//console.log(1 > true); //false//console.log(1 >= true); //true//console.log(1 > "0"); //true//console.log(10 > null); //true//任何值和NaN做任何比较都是false//console.log(10 <= "hello"); //false//console.log(true > false); //true//console.log("1" < "5"); //true//console.log("11" < "5"); //true//比较两个字符串时，比较的是字符串的字符编码//console.log("a" < "b");//true//比较字符编码时是一位一位进行比较//如果两位一样，则比较下一位，所以借用它来对英文进行排序//console.log("abc" < "bcd");//true//比较中文时没有意义//console.log("戒" > "我"); //true//如果比较的两个字符串型的数字，可能会得到不可预期的结果//注意：在比较两个字符串型的数字时，一定一定一定要转型console.log("11123123123123123123" < +"5"); //true</script></head><body></body>
</html>编码
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script type="text/javascript">/** 在字符串中使用转义字符输入Unicode编码* \u四位编码*/console.log("\u2620");</script></head><body><!--在网页中使用Unicode编码&#编码; 这里的编码需要的是10进制--><h1 style="font-size: 200px;">☠</h1><h1 style="font-size: 200px;">⚀</h1></body>
</html>
相等运算符
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script type="text/javascript">/** 相等运算符用来比较两个值是否相等，* 如果相等会返回true，否则返回false* * 使用 == 来做相等运算* - 当使用==来比较两个值时，如果值的类型不同，* 则会自动进行类型转换，将其转换为相同的类型* 然后在比较* 不相等* 不相等用来判断两个值是否不相等，如果不相等返回true，否则返回false* - 使用 != 来做不相等运算* - 不相等也会对变量进行自动的类型转换，如果转换后相等它也会返回false* * * ===* 全等* - 用来判断两个值是否全等，它和相等类似，不同的是它不会做自动的类型转换* 如果两个值的类型不同，直接返回false* !==* 不全等* - 用来判断两个值是否不全等，和不等类似，不同的是它不会做自动的类型转换* 如果两个值的类型不同，直接返回true*///console.log(1 == 1); //truevar a = 10;//console.log(a == 4); //false//console.log("1" == 1); //true//console.log(true == "1"); //true//console.log(null == 0); //false/** undefined 衍生自 null* 所以这两个值做相等判断时，会返回true*///console.log(undefined == null);/** NaN不和任何值相等，包括他本身*///console.log(NaN == NaN); //falsevar b = NaN;//判断b的值是否是NaN//console.log(b == NaN);/** 可以通过isNaN()函数来判断一个值是否是NaN* 如果该值是NaN则返回true，否则返回false*///console.log(isNaN(b));//console.log(10 != 5); //true//console.log(10 != 10); //false//console.log("abcd" != "abcd"); //false//console.log("1" != 1);//false//console.log("123" === 123);//false//console.log(null === undefined);//falseconsole.log(1 !== "1"); //true</script></head><body></body>
</html>条件运算符
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script type="text/javascript">/** 条件运算符也叫三元运算符* 语法：* 条件表达式?语句1:语句2;* - 执行的流程：* 条件运算符在执行时，首先对条件表达式进行求值，* 如果该值为true，则执行语句1，并返回执行结果* 如果该值为false，则执行语句2，并返回执行结果* 如果条件的表达式的求值结果是一个非布尔值，* 会将其转换为布尔值然后在运算*///false?alert("语句1"):alert("语句2");var a = 300;var b = 143;var c = 50;//a > b ? alert("a大"):alert("b大");//获取a和b中的最大值//var max = a > b ? a : b;//获取a b c 中的大值//max = max > c ? max : c;//这种写法不推荐使用，不方便阅读var max = a > b ? (a > c ? a :c) : (b > c ? b : c);//console.log("max = "+max);//"hello"?alert("语句1"):alert("语句2");</script></head><body></body>
</html>运算符的优先级
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script type="text/javascript">/** , 运算符* 使用,可以分割多个语句，一般可以在声明多个变量时使用,*///使用,运算符同时声明多个变量//var a , b , c;//可以同时声明多个变量并赋值//var a=1 , b=2 , c=3;//alert(b);/** 就和数学中一样，在JS中运算符也有优先级，* 比如：先乘除 后加减* 在JS中有一个运算符优先级的表，* 在表中越靠上优先级越高，优先级越高越优先计算，* 如果优先级一样，则从左往右计算。* 但是这个表我们并不需要记忆，如果遇到优先级不清楚* 可以使用()来改变优先级*///var result = 1 + 2 * 3;/** 如果||的优先级高，或者两个一样高，则应该返回3* 如果与的优先级高，则应该返回1* */var result = 1 || 2 && 3;console.log("result = "+result); </script></head><body></body>
</html>代码块
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script type="text/javascript">/** 我们的程序是由一条一条语句构成的* 语句是按照自上向下的顺序一条一条执行的* 在JS中可以使用{}来为语句进行分组,* 同一个{}中的语句我们称为是一组语句，* 它们要么都执行，要么都不执行，* 一个{}中的语句我们也称为叫一个代码块* 在代码块的后边就不用再编写;了* * JS中的代码块，只具有分组的的作用，没有其他的用途* 代码块内容的内容，在外部是完全可见的*/{var a = 10; alert("hello");console.log("你好");document.write("语句");}console.log("a = "+a);</script></head><body></body>
</html>流程控制语句
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script type="text/javascript">/** 流程控制语句* - JS中的程序是从上到下一行一行执行的* - 通过流程控制语句可以控制程序执行流程，* 使程序可以根据一定的条件来选择执行* - 语句的分类：* 1.条件判断语句* 2.条件分支语句* 3.循环语句* * * 条件判断语句：* - 使用条件判断语句可以在执行某个语句之前进行判断，* 如果条件成立才会执行语句，条件不成立则语句不执行。* - if语句* - 语法一：* if(条件表达式){* 语句...* }* * if语句在执行时，会先对条件表达式进行求值判断，* 如果条件表达式的值为true，则执行if后的语句，* 如果条件表达式的值为false，则不会执行if后的语句。* if语句只能控制紧随其后的那个语句,* 如果希望if语句可以控制多条语句，* 可以将这些语句统一放到代码块中* if语句后的代码块不是必须的，但是在开发中尽量写上代码块，即使if后只有一条语句* */var a = 25;if(a > 10 && a <= 20){alert("a大于10，并且 a小于等于20");} </script></head><body></body>
</html>if语句
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script type="text/javascript">/** if语句* 语法二:* if(条件表达式){* 语句...* }else{* 语句...* }* * if...else...语句* 当该语句执行时，会先对if后的条件表达式进行求值判断，* 如果该值为true，则执行if后的语句* 如果该值为false，则执行else后的语句* * 语法三：* if(条件表达式){* 语句...* }else if(条件表达式){* 语句...* }else if(条件表达式){* 语句...* }else{* 语句...* }* * if...else if...else* 当该语句执行时，会从上到下依次对条件表达式进行求值判断* 如果值为true，则执行当前语句。* 如果值为false，则继续向下判断。* 如果所有的条件都不满足，则执行最后一个else后的语句* 该语句中，只会有一个代码块被执行，一旦代码块执行了，则直接结束语句*/var age = 50;/*if(age >= 60){alert("你已经退休了~~");}else{alert("你还没退休~~~");}*/age = 200;/*if(age > 100){alert("活着挺没意思的~~");}else if(age > 80){alert("你也老大不小的了~~"); }else if(age > 60){alert("你也退休了~~");}else if(age > 30){alert("你已经中年了~~");}else if(age > 17){alert("你已经成年了");}else{alert("你还是个小孩子~~");}*/age = 90;if(age > 17 && age <= 30){alert("你已经成年了");}else if(age > 30 && age <= 60){alert("你已经中年了");}else if(age > 60 && age <= 80){alert("你已经退休了");}else{alert("你岁数挺大的了~~");}</script></head><body></body>
</html>js基础知识汇总03相关推荐
- JS基础知识学习（一）
JS基础知识 前端开发常用的浏览器 谷歌浏览器(chrome):Webkit内核(v8引擎) 火狐浏览器(firefox):Gecko内核 欧朋浏览器(opera):Presto内核 IE浏览器:Tr ...
- 脑科学与脑电基础知识汇总
点击上面"脑机接口社区"关注我们 更多技术干货第一时间送达 脑科学与脑电基础知识汇总 该部分汇总了社区分享的部分脑科学.EEG.fNIRS.BCI.人机交互等相关知识. 脑电与情绪 ...
- python基础知识资料-Python基础知识汇总
原标题:Python基础知识汇总 1.Anaconda的安装 百度Anaconda的官网,下载左边的Python3.X版本 然后是设置路径,最后给出Jupyter notebook.具体参考: 猴子: ...
- python基础知识资料-学习Python列表的基础知识汇总
千里之行,始于足下.要练成一双洞悉一切的眼睛,还是得先把基本功扎扎实实地学好.今天,本喵带大家仔细温习一下Python的列表.温故而知新,不亦说乎. 当然,温习的同时也要发散思考,因为有些看似无关紧要 ...
- （七）JS基础知识四（搞定异步）【三座大山之三，必考！！！】
JS基础知识四(异步) 提问 单线程 应用场景 callback hell和promise 提问 同步和异步的区别是什么 手写用Promise加载一张图片 前端使用的异步的场景有哪些 单线程 JS是单 ...
- （六）JS基础知识三（走进作用域和闭包）【三座大山之二，不会闭包，基本不会通过】
JS基础知识三(作用域和闭包) 提问 作用域 自由变量 闭包 this 提问 this的不同应用场景,如何取值 手写bind函数 实际开发中闭包的应用场景,举例说明 创建10个a标签,点击的时候弹出对 ...
- （五）JS基础知识二（通过图理解原型和原型链）【三座大山之一，必考！！！】
JS基础知识二(原型和原型链) 提问 class 继承 类型判断(instanceof) 原型 原型关系 基于原型的执行规则 原型链 说明 提问 如何准确判断一个变量是不是数组 class的原型本质 ...
- （四）JS基础知识一（深入分析变量类型和计算）【不会变量，别说你会JS】
JS基础知识一(变量类型和计算) 提问 变量类型 值类型 vs 引用类型 (堆栈模型) 值类型 引用类型 typeof 运算符 深拷贝 变量计算 字符串拼接 == if语句和逻辑运算 if语句 逻辑判 ...
- Js基础知识梳理系列
小序:总是感觉自己的技术一直在原地踏步,想学习一些新的技术,但学起来很吃力,而且总是没有什么实际的收获,似乎进入了所谓的"瓶颈期".问了一些前辈是否也遇到过同样的问题,他们给我的解 ...
- 了解js基础知识中的作用域和闭包以及闭包的一些应用场景，浅析函数柯里化
js基础知识中的作用域和闭包 一.作用域 1.作用域.自由变量简介 (1)作用域定义 (2)作用域实例演示 (3)自由变量定义 (4)自由变量实例演示 2.作用域链简介 (1)作用域链定义 (2)作用 ...
最新文章
- 河北计算机应用技术,［河北科技大学］计算机应用技术
- 封杀所有Bytespider蜘蛛，太频繁，太操蛋，不杀不行~~~
- python shape函数_Perlin噪声和Python的ctypes
- unity 调用 .dll 或 .so时遇到的问题
- Spring 常用注入注解（annotation）和其对应xml标签
- Python time.time()方法
- JAVA 判断Socket 远程端是否断开连接
- 胡润富豪榜2020出炉，雷军身价是任正非的十倍？
- tomcat7简单优化
- android扫雷PPT,《扫雷游戏制作》PPT课件.ppt
- 小米便签产品级的源码
- kindle可以上网但是无法下载_您的Kindle已连接WiFi网络，但无法连接互联网的解决办法...
- linux音响会产生pulse文件,Linux声音系统和PulseAudio简介
- 真正可以根治高度近视眼的方法(转载)
- 报错：npm ERR code EPERM
- 香港服务器租用不得不警惕的潜规则
- Ubuntu20.04 配置阿里云源
- 在Emacs中使用TODO
- matlab阻抗测量模块,基于matlab技术实现频谱分析仪测量阻抗
- 修复采集接口版云开发表情包微信小程序源码下载增加制作等功能