一、布尔值和关系运算符、逻辑运算符

1.1 布尔值

  我们上篇文章说了,学习了两种变量的类型数值型、字符串型。
  实际上,还有很多变量的类型。我们今天再学习一种,叫做“布尔类型”。

数值型里面的值,有无穷多个,因为世界上所有的数字,都是数值型; 字符串型的值,有无穷多个,因为世界上所有的文字、语句都是字符串型;
布尔类型的值,就两个,true、false。
true 真
false 假

1   var a = true;
2 var b = false;
3 console.log(a); //输出
4 console.log(b); //输出
5 console.log(typeof a); //输出类型
6 console.log(typeof b); //输出类型


  布尔值,直接使用就可以了,千万不要加上引号。

1.2 关系运算符

  上篇文章,我们学习了一些运算符,都是“数学运算符”。有:
+ - * / %
  实际上,JS中运算符还有很多,今天我们介绍一种运算符“关系运算符”。

> 大于号
<小于号
>= 大于或等于
<= 小于或等于
== 等于
=== 全等于
!= 不等于
!== 不全等于
关系运算符,和我们小学学习的意思,一样:

1   console.log(5 > 6);//false
2 console.log(55 > 6);//true
3 console.log(55 > 66);//false

小时候学习过≥,实际上在JS中需要用>=来表示,注意中间不能有空格!比如> =

1   console.log(16 >= 5);       //true
2 console.log(16 >= 16); //true
3 console.log(16 >= 32); //false

判断用户是否及格:

1       <script type="text/javascript">
2 //得到用户的成绩
3 var chengji = parseInt(prompt("请输入成绩"));
4 //输出结果:
5 alert(chengji >= 60);
6 </script>

等于

1   console.log(5 == 5);    //true
2 console.log(5 == 6); //false

  注意,在JS中=符号只有一个意思!表示赋值!!
  如果想判断两个东西,是否相等,需要使用符号==
  不能用一个等号,来表示等于的关系:

1   console.log(3 = 8);


== 这个符号,还可以验证字符串是否相同:

1   console.log("我爱北京天安门" == "我爱北京天安门");//ture

==等等不严谨,会将不同类型的东西,转为相同类型进行比较

1   console.log("5" == 5);      //true
2 console.log(56 == "56"); //true

全等于,就是三个等号===

1   //全等于
2 console.log("56" === 56); //false
3 console.log(56 === "56"); //false
4 console.log("56" === "56"); //true
5 console.log(56 === 56); //true

  也就是说,==两个等号,不严谨,”5”和5是true; ===三个等号更为严谨,”5”和5是false。
  != 就是==的反面; !==就是===的反面

1   console.log(3 != 8);    //true
2 console.log(3 != "3"); //false,因为3==”3”是true,所以反过来就是false。
3 console.log(3 !== "3"); //true,应为3===”3”是false,所以反过来是true。

1.3 逻辑运算符

  逻辑运算符有三个:

&& 与(且)
|| 或
! 非

  参与逻辑运算的,都是布尔值。也就是说,只有true、false才能参与逻辑运算,得到的答案,仍然是布尔值。

1   // &&表示“且”的意思,都真才真
2 console.log(true && true); //true
3 console.log(true && false); //false
4 console.log(false && true); //false
5 console.log(false && false); //false

或者的意思:

1   console.log(true || true);          //true
2 console.log(true || false); //true
3 console.log(false || true); //true
4 console.log(false || false); //false

!表示“非”,没啥好说的,

1   console.log(!true);//false
2 console.log(!false);//true

1.4 连比的写法

  比如,我们想看看2这个数字,是不是在3和15之间:

1   console.log(3 < 2 < 15);//true

错误的写法。
  这是因为,计算机会先计算3<2,得到的答案就是false。然后false<15,false会被隐式转换为0,所以0<15是tue。
应该拆开,中间用一个&&连接。 也就是说:
“3小于2” 且 “2小于15”。

1   console.log(3 < 2 && 2 < 4);//false

  判断一个人是否能够考驾照,交通法规定18~70岁能够考驾照。

1   //得到用户年龄
2 var age = parseInt(prompt("请输入年龄"));
3 //显示结果
4 alert(age >= 18 && age <= 70);

二、if语句

2.1 if语句初步

  如果……那么……否则……
  if就是英语“如果”的意思,else就是“否则”。
举个例子:

1   if(明天不下雨){
2 我就出去玩;
3 }else{
4 我就在家写作业;5 }

一个程序:

1       <script type="text/javascript">
2 var a = 10; //设置变量
3 if(a > 5){
4 console.log("哈哈");
5 }else{
6 console.log("嘻嘻");
7 }
//结果为 哈哈
8 </script>

小题目:
用户输入自己的年龄,判断用户是否在18~70岁,如果在,那么弹出框框“恭喜,可以考驾照”,“加油啊”;
否则弹出“年龄不符合要求”。 最后,都要弹出“么么哒”。

1       <script type="text/javascript">
2 //第一步,得到用户输入的年龄
3 var age = parseInt(prompt("请输入年龄"));
4 //第二步,判断。if的结构体
5 if(age >= 18 && age <= 70){
6 alert("恭喜,可以考驾照");
7 alert("加油啊");
8 }else{
9 alert("年龄不符合要求");
10 }
11 alert("么么哒");
12 </script>

2.2 if语句的嵌套

小例子:
一个加油站为了鼓励车主多加油,所以加的多有优惠。
92号汽油,每升6元;如果大于等于20升,那么每升5.9;
97号汽油,每升7元;如果大于等于30升,那么每升6.95
编写JS程序,用户输入自己的汽油编号,然后输入自己加多少升,弹出价格。
两层:

1           //第一步,输入
2 var bianhao = parseInt(prompt("你想加什么油?填写92或者97"));
3 var sheng = parseFloat(prompt("你想加多少升?"));
4
5 //第二步,判断
6 if(bianhao == 92){
7 //编号是92的时候做的事情
8 if(sheng >= 20){
9 var price = sheng * 5.9;
10 }else{
11 var price = sheng * 6;
12 }
13 }else if(bianhao == 97){
14 //编号是97的时候做的事情
15 if(sheng >= 30){
16 var price = sheng * 6.95;
17 }else{
18 var price = sheng * 7;
19 }
20 }else{
21 alert("对不起,没有这个编号的汽油!");
22 }
23
24 alert("价格是" + price);

2.3 if语句的小知识点

  else部分可以省略。

1       <script type="text/javascript">
2 var a = 10;
3 if(a > 20){
4 alert("这个数字大于20");
5 }
6 </script>

  没有else部分,就是说没有“否则”,如果条件表达式不满足了,那么就什么都不做。
如果要做的事情,只有一句话,那么可以省略大括号(初学者尽量不要这么玩儿,一定要把大括号写完整):

1       <script type="text/javascript">
2 var a = 2;
3 if(a > 5) alert("这个数字大于5");
4 alert("哈哈哈哈");
5 </script>

三、for循环语句

3.1 认识for循环

在控制台输出1~100

1   console.log(1);
2 console.log(2);
3 console.log(3);
4 console.log(4);
5 console.log(5);
6 console.log(6);
7 console.log(7);
8 console.log(8);
9 ……
10 console.log(100);

循环语句,就是执行一些类似的代码,让这些代码的编写变得简化。

1   for(var i = 1 ; i <= 100 ; i++){
2 console.log(i);3 }

JavaScript--小白入门篇2的更多相关文章

  1. 【Unity游戏开发】SDK接入与集成——小白入门篇

    一.简介 通常一款游戏开发到后期,一般都会涉及到第三方SDK的接入与集成,对于不熟悉SDK接入的同学来说,接SDK每次都是云里雾里,而熟悉SDK接入的同学又觉得不断地重复做接入SDK工作这样没有成就感 ...

  2. Javascript之入门篇(一)

    上一篇学习了什么是JavaScript语言及其作用和特有的特点等,本篇将详细介绍JavaScript一些入门使用方式. 对于初学者来讲,由于JavaScript是嵌入到HTML页面里面的,首先创建一张 ...

  3. JavaScript的入门篇

    快速认识JavaScript 熟悉JavaScript基本语法 窗口交互方法 通过DOM进行网页元素的操作 学会如何编写JS代码 运用JavaScript去操作HTML元素和CSS样式 <!DO ...

  4. JavaScript(JS)入门篇

    <script type="text/javascript"> 表示在<script></script>之间的是文本类型(text),javas ...

  5. 【MySQL】Linux下mysql安装全过程——小白入门篇(含有问题详解)

    本次安装操作在申请的腾讯云上实现(版本:CentOS Linux release 7.4.1708 (Core) ). 根据教程实现(中途各种挖坑,填坑...),地址:http://www.runoo ...

  6. 阿里云学生机——Mysql配置---教小白入门篇

    首先,我的学生机默认配置为:CentOS 7.2 64位 + Tomcat 8 + Jdk8 + MySQL5.7.16 扩展:Linux 如何查看 MySQL 版本号----使用命令 mysql - ...

  7. JavaScript之入门篇(二)

    终于学到后面的语法部分了,感觉这门语言基础部分和当初学习VB的时候感觉一样一样的,章节目录让我不禁又想到了VB课本.由于怕学过了,过段时间忘了,于是,大概总结一下. 数据类型部分 ① Typeof操作 ...

  8. 小白入门篇:flex布局

    --前言 因为这个星期写一个小的项目用到flex布局和grid布局,虽然这两种布局都是兼容性都有问题,但是别急,我觉的以后肯定是会发展并且流行起来的,毕竟google大法好,而且这两个布局真的比一般的 ...

  9. ArcGIS API for JavaScript小白入门

    简单理解就是:通过js调用arcgis相关的方法和通过html引入css等资源来展示地图,代码如下: <!DOCTYPE html> <html> <head> & ...

  10. Monkey小白入门篇

    一.monkey简介 中文名:猴子 职业:压力测试小工具 用途:对待测Android应用程序进行压力测试,测试app是否会crash Android官方描述: The Monkey is a prog ...

随机推荐

  1. 关于Time Series Database

    今天观察了下clojure之父datomic.com的数据库 有点类似sequence数据库的变种 不过这类数据库,感觉用在移动端会更有市场: 1. 移动端需要这种可以本地存储,无删除,联网只增加,只 ...

  2. 【CSU 1803】2016

    http://acm.csu.edu.cn/OnlineJudge/problem.php?id=1803 Solution: 考虑两个数x,y乘积%2016=0 x×y≡0(MOD 2016) x= ...

  3. 关于flask的错误:ImportError: cannot import name 'Flask'

    刚开始接触flask,新创建后不能运行,报错如下图: 导致该错误有两种可能,没安装flask:文件名为flask. 可尝试如下两种方法解决: 方法一:若没安装过flask,则进入cmd,输入pip i ...

  4. 【转载】7条便利的ViewState技巧

    32.Seven handy ViewState tips 32.7条便利的ViewState技巧 Every time I have to deal with a classic ASP.NET W ...

  5. ElasticSearch NEST

    1. 什么是ElasticSearch? ElasticSearch is a powerful open source search and analytics engine that makes ...

  6. bzoj 3534: [Sdoi2014]重建【矩阵树定理】

    啊啊啊无脑背过果然不可取 比如这道题就不会写 参考:https://blog.csdn.net/iamzky/article/details/41317333 #include<iostream ...

  7. bzoj 2091: [Poi2010]The Minima Game【博弈论+贪心+dp】

    不知道算不算博弈 很妙的贪心,一直在想SG函数结果... 首先从大到小排个序,然后考虑当前的人要怎么选:如果不选最后一段,那么另一人会选,这样不利于当前的人,所以每个人一定会选最后一段 设f[i]为要 ...

  8. [App Store Connect帮助]四、添加 App 图标、App 预览和屏幕快照(2)添加一个 App Store 图标

    您必须提供一个 App Store 图标,用于在 App Store 中的不同部分展示您的 App.请遵照 Human Interface Guidelines(<人机界面准则>)创建您的 ...

  9. JavaScript编程艺术-第10章-10.1-动画

    10.1—最简单的动画 ***代码亲测可用*** 动画:让元素位置随着时间而不断地发生变化 HTML: <!DOCTYPE HTML> <html> <head> ...

  10. Js 使用小技巧总结(1)

    1.Js 的时间控制,小于初始时间,大于截止时间 <script type="text/javascript">        window.onload = Game ...