JavaScript2023版本(2023-1-28)

第一章：JavaScript概述

1.HelloWorld

JavaScript是一门解释型语言  函数式语言  单线程  面向对象 扩展ES

//1.输出语句
// alert("hellWorld");//这个在js环境里面无法运行需要在浏览器里面  窗口输出
// console.log("HelloWorld");//控制台输出
// document.write("Hello World")//这个是在网页页面输出

2.编写位置

/*
* 1.可以将js编写在网页内部的script标签中
*
* 2.单独写在外部js文件  之后在html中引入js  <script src="......"></script>
*
*
* 3.可以将指定的js代码编写在指定属性中
* */

console.log("计算机科学与技术")

3.基本语法

/*      1.多行注释
* */

//  2.单行注释


/*          --注释中的内容会被忽略
*           --可以通过注释来对代码进行解释说明
*           --也可以通过注射来解决掉不想执行的代码
*
* */

/*
*
* 3.js严格区分大小写
* */



//4  在js中多个空格和换行会被忽略 可以利用这个特点进行格式化

//5.分号问题  js中每条语句 都应该以分号结尾   alert()  js中有自动添加分号的机制  不写由浏览器自动判断

第二章：数据类型

1.字面量和变量

/*          --字面量就是一个值  所代表的含义就是他字面的意思
                比如  0 1 2 3 4 5 6 7  "hello World"....
*                       在js中所有的字面量都会去执行  但是直接使用字面量会不方便
*               2.变量   变量可以用来存储字面量 并且变量中存储的字面量可以随意的修改
*                   并且变量中存储的字面量可以随意的修改
                    通过变量可以对字面量进行描述  并且变量方便修改
 */
console.log(true)


let x;
x="计算机科学与技术学院"

console.log(x)

//变量的使用：1.声明变量  2.使用变量
let a;
let e,b,c;

//变量赋值
a=10;b=20;
console.log(a,b)

//还可以使用 var
var f,h,g;
f=9;h=80;
console.log(f)

2.常量

/*
*       1.在js中 使用const声明常量
*               常量只能赋值一次  不能重复 赋值
*               在js中除了了常规的常量外  有一些对象类型的数据我们也会声明为常量
* */




//1.常量：
let PI=3.1415926;
console.log(PI)

PI=2;
console.log("变化后",PI);
//数据会被修改  我们需要一个常量 

const p=123;

3.标识符

/*标识符：
*           在js中所有可以由我们自主命名的内容 都可以是一个标识符
*
*           像  变量名  函数名  类名
*
*       使用标识符时 我们需要遵循如下的规范：
*               1.标识符  只能含有字母  数字 下划线  $符 且不能有数字开头
*               2.标识符不能是js中的关键字和保留字
*
*       命名规范：
*               使用驼峰命名法
*               类名  使用大驼峰命名法
*                   首字母大写  每个单词开头大写
*
*
* */

let a_1=10;
let as$=29;


// let let=10;//这个就是保留字

4.数据类型-数值

/*          数值：number
*                   --在js中所有的整数浮点数 都number类型
*               js中的数字并不是无限大  当这个数字超过一定范围后会显示近似值
*                   --Infinity  是一个特殊的数值表示无穷
* 所以在js中进行一些精度比较高的运算  一定要注意
*               NaN也是一个特殊的数值  表示数据非法
*
*
*               大整数：用来表示一些比较大的整数  BigInt
*                  大整数使用n结尾  可以表示的数据范围由内存决定
*
* */

let a=10
console.log(a);
 a=90;
console.log(a)


let b=89898989**9898998;
console.log(b);


let c=0.1+0.2;
console.log(c)


/*          其他进制的数字：
                        二进制：0b
*                       八进制：0o
                        十六进制：0x
*
*
* */

let m=0x101;
console.log(m);

5.类型检查

/*          类型检查：
*                   typeof运算符  用来检查不同值的类型  它会根据不同的值返回不同的结果
*
*
* */

let a=10 ;
let b=10n;
console.log(a);
console.log(b)

console.log(typeof a)
console.log(typeof b)

6.字符串

/*
*       字符串：在js中使用单引号或双引号来表示字符串
*              转义字符  \
*                           \" ->"
*                           \'->.
*                           \t-->制表符
*           模板字符串：使用反单引号` 来表示模板字符串
*                       模板字符串中可以嵌入一个变量
*               使用typeof检查字符串的时候会返回一个string
*
*  */

let a='hello';
let b="计算机科学与技术"


console.log(a+b)


let c="";
console.log(typeof c)

7.其他字符串

/*          1.布尔值：主要进行逻辑判断
                    布尔值：TRUE  false
*                   使用typeof 检查的时候会返回 布尔
*           2.空值(null)  控值表示空对象  空值只有一个null
*                   使用typeof检查会返回一个Object
                                  使用typeof检查控值毫无意义
*               3.undefined 未定义
                        当声明一个变量没有赋值的时候  它的值类型就是undefined
                            使用typeof检查会返回一个undefined


                            符号(Symbol)创建唯一标识
                                    使用typeof检查会返回 Symbol


                                    js中原始值一共有七种 构成各种数据  原始值在js中是不可变类型 
*
* */

let bool=true//真
console.log(bool)

let bool1=false//假
console.log(bool1)

let  a=null;
console.log(a)


let y=Symbol();
console.log(y);

8.类型转换

/*类型转换：将一种数据类型转换为其他类型
*           将其他类型转换为（字符串  数值  布尔值）
*
*
*           由于null和undefined中没有toString方法因此  对这两个类型调用会报错
*
*
* 2.调用String()函数会将其他类型转换为字符串
*               --调用xxx函数
*                       --->xxx()
*
* 
*           原理：对于拥有toString()方法的值调用String()函数时  实际上就在调用toString()方法
*               对于null  则直接转换为‘null’
*               对于undefined 则直接转换为'undefined'
* 
* 
* */


let a=100;
console.log(typeof a,a)



//1、调用toString方法来讲其他数据类型转换为字符串  调用 xxx的yyy方法  -->xxx.yyy()方法
        let y=900;
console.log(y.toString());//创建了一个字符串而已  并没有赋值
y=y.toString();
console.log(y)
console.log(typeof y)




let o=90;
console.log(typeof o,o)

o=String(o)
console.log(typeof o,o)//这样子就转换成功了

/*
*           将其他的数据类型转换为数值：
*                           1.使用number()函数来转换为数值
*                                           如果字符串是一个合法的数字则会转换为对应的主
*                                       如果不是合法的数字  就会转换为NaN
*                                           如果字符串是空串  就会转换为0
*                           2.布尔值：true-->1  false-->0
*
*
*           专门用来将字符串转换为数值的两个方法：
*                   parseInt()--整数  将一个字符串转换为一个整数
*                   parseFloat()--浮点数 将一个字符串转换为一个浮点数
*
* */


let a="计算机"
console.log(typeof a,a)

a=Number(a)
console.log(typeof a,a)


let b='0x123'
b=parseInt(b)
console.log(typeof b,b)

/*
* 
*           1.使用boolean()函数来将其他类型转换为布尔值
*                       强调转换的情况：
*                               数字  除了0和Nan是false  其余都是TRUE
*                               字符串：空串是false  其余是TRUE
*                           null和undefined转换为false
* 
*           2.对象通常都会转换为TRUE 
*                       所有表示空性  的或者没有的值都会转换为false
* 
*                          
* */

let a=1
console.log(typeof a,a)

第三章：数据运算

1.算数运算符

/*
* 算数运算符:
*           运算符又叫从操作符  用来进行运算
*                   加   +
*                    减  -
*                   乘       *
*                   除       /
*                   幂运算：**
*                       %取模  两个数相除取余数
* */


let a=1+1
console.log(a);

let b=2*a;
console.log(b)

let c=b/0;
console.log(c)

let d=8**3//这个就是读作8的三次方
console.log(d)


let e=d%2
console.log(e)

/*          js是一门弱类型语言   当进行运算的时候会通过自动的类型转换来完成运算
*
*
* */

let y=10-'29';//会自动转换为数值
console.log(y)

//注意：算数运算时候  除了字符串的加法  其他运算的操作数是非数值的时候  会转换为数值后在运算

let i=3+true;
console.log(i);

/*当任意一个值和字符串做加法的时候  他会将其他值转换为字符串  然后再将字符串在做拼串操作
*
* */

let l="hello"+"World"//字符串的拼接
console.log(l)

2.赋值运算符

/*
*
*       f赋值运算符：用来将一个值赋值给变量
*
*
*
*
* */

let a=10;
let b=a;//一个变量只有在等号左边时才是变量  在=右边时 才是值
console.log(a===b)

/*
*                +=     a+=n  等价于 a=a+n
*               -=         a-=n  等价于 a=a-n
*               /=          a/=n  等价于a=a/n
*               %=          a%=n  等价于 a=a%n
*               **=            a**=n 等价于a=a**n
*               ??=   空赋值  只有当变量的值为null或undefined才会赋值成功
* 
* 
* */


let i=7;
i=i+5;
i+=5;
console.log(i)

3.一元运算符

/*
*           一元运算符：
*               + 正号并不会数值的符号的
*               -  可以对符号位进行取反
*
*       当我们对非数值类型进行运算时  会先将其转换为数值在进行运算
* */

let a=-10
a=-a;
console.log(a)

4.自增和自减

/*
*           ++运算符
*                       ++运算符会使得原来的变量增加一
*               ·自增分为前自增（++a）和后自增（a++）
*                       无论++a还是a++都会使得原变量立刻增加一
*                   不同的是++a和a++所返回的值不同
*                           a++是自增前的值 旧值
*                           ++a是自增后的值  是新值
*           --运算符：自减运算符
*                       --运算和++运算是一样的
* */


let a=10;
a + 1;
console.log(a)//很明显这里输出了10


//调用  a++
a++;
console.log(a)


++a;
console.log(a)

let  c=9;
let result=c++ + ++c +c;
console.log("c等于：",result);

5.逻辑运算符

/*
*
*       !  逻辑非
*                   --用来对一个值进行非运算  对一个布尔值进行取反操作
*                                       true-->false
*                           如果对于一个非布尔值来进行取反  那么它会先转换为布尔值在来进行运算
*       类型转换：
*               转换为字符串
*                                   显式转换        调用String()
*                                   隐式转换  + ""
*               转换为数值
*                       显式转换：  调用Number()
*                       隐式转换：  +
*
*               && 逻辑与        对左右的值进行与运算
*                       当与运算左右都为true  则返回true
*                       与运算是直接找false  找到false就直接返回 没有false才会返回true
*                   对于非布尔值进行与运算 他会转换为布尔值 然后再运算
*                           最终会返回原值
*                           如果第一个值为false 则直接返回第一个值
*                           如果第一个值为true 则返回第二个值
* 
*                ||逻辑异或
*                       左右有true的时候 返回 true 否则返回false
*                       或运算是找true 如果找到true则直接返回 没有true才会返回false
*               对于非布尔值或运算 他会转换为布尔值在进行运算
*                   但是最终会返回原值
*                           第一个值为true  返回true
*                   为false  则返回第二个
*       
* */


let a=true;
console.log(a)

console.log(!a)
console.log(!!!a)


//例如：对
console.log(!1);


let result=true&&false
console.log("逻辑与："+result)

6.关系运算符

/*
*           关系运算符：
*                   用来检查两个值之间的关系是否成立
*                       成立返回true  不成立返回false
*                      >
*                       检查左值是否大于右值
*                    <
*                           检查左值是否小于右值
*                   >=
*                           检查左值是否大于等于右值
*                   <=
*                            检查左值是否小于小于右值
*
*
*
* */

let result=10>8;
console.log(result)//true


//当对其非数值进行运算时  会先将其转换为数值在进行比较
console.log(1>'hello');//false

console.log("a">"b");//当把同类型的两个值比较时  会逐位比较 字符的ASCII码的顺序

console.log("123">"124")//false
//比较两个字符串格式的数字时 一定要进行类型转换

7.条件运算符

/*
*
*       条件运算符：
*               条件表达式?表达式1:表达式2
*                   在执行时   会先对提交表达式进行一个求值判断
*                       如果结果 为true  执行表达式1
*                       如果结果为false 执行表达式2
* */


let c=2>1?"你好":"你不好";
console.log(c)//输出你好  因为2大于1 所以第一个的结果是true 执行第一个表达式

8.运算符的优先级

/*      和数学一样  
*               先乘除后加减  小括号有最高的优先级  因此可以使用小括号来改变运算的优先级
* 
* */

9.代码块

/*
* 使用{}来创建代码块  对代码进行分组
*           同一个代码块中的代码 就是同一个组代码  一个代码块中的代码要么都执行要么就都不执行
* 
* 
*           let  声明的变量 具有快作用域
*                   在代码块中声明的变量无法在代码的外部访问
*           var  使用var声明的变量不具有快作用域
* 
* 
* */

{
    
    let a=10;
    console.log(a)
}

{
    let b=190;
    var c="你好"
    console.log(b)
    
}

console.log(c)//可以访问  因为是var作用的

第四章：流程控制语句

1.if语句介绍

/*
*                流程控制语句：改变程序执行的顺序
*           1.条件判断语句
*            2.条件分支语句
*           3.循环语句
*
*
*
*                    if  语句：
*                     语法：  if(条件表达式)  {语句}
*
*               执行流程：
*                   if语句在执行前会先对if后面的条件表达式进行一个求值判断
*                       如果结果为true  则执行
*                       为false  则不执行
* 
* 
*                   if语句只会控制紧随其后的那一行代码
*               如果希望可以控制多行代码可以使用 花括号来把语句括起来
*                   最佳实践  即使if后面只有一行代码我们也要 编写代码块  这样结构会更加清晰
*                       注意事项：如果条件表达式不是布尔值  那么就会先转换为布尔值 才可以执行
*                    
* 
* */
            if(true){

                console.log("你好  为True")
            };
console.log("****************************")


           

2.if…else语句

/*              if--else语句
*               if(条件表达式){
*
*                   语句....
*                   }else {
*                       语句....
*                               }
*
*       执行规则：if--else执行时  先对条件进行求值判断  如果是true 则执行if后面的语句  负责就执行else后面的语句
*
*           if-else  if --else 
*                   if(条件表达式){
*                   语句....
*                   }else if (条件表达式){
*                       语句...
*                   }else if(条件表达式){
*                   语句...
*                       }else ...if(条件表达式){
*                       y语句....
*                           }
*                           这个形式会自上而下 依次对if后面的条件表达式进行求值判断  
*                   如果为true  则执行当前if后面的语句
*                   如果为false  就向下继续
*           注意：if-else  if-else语句中只会有一个代码块被执行  一旦执行的代码块  下面的条件就不会在执行了
*
* */


/*
let age=90;
if (age>60){

    console.log("你已经退休了")
}
else {

    console.log("你还没有退休")
}
*/
if(age>40){
    
    console.log("真年轻！")

}else if(age>50 &&age<60){
    
    console.log("你已经中年了")

}else if (age>18 &&age<30){
    
    console.log("你已经成年了")
    
}else if (age>30 &&age<40){

    console.log("你已经处于壮年了！")
}else {

    console.log("你已经去世了！")
}

let a=prompt("请输入一个数")//获取用户输入的内容  但是不能在node环境下运行 只能在浏览器上运行
console.log(a);

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<script type="text/javascript">


    let a=prompt("请输入一个整数！")
    if (a%2===0){
        console.log("是偶数")
        alert("是偶数！")
    }
</script>

</body>
</html>

3.switch语句

/*
                语法：
            Switch(表达式){
                    case 表达式:
                        语句...
                        break;
             case 表达式:
                        语句...
                        break; case 表达式:
                                    语句...
                        break; case 表达式:
                                语句...
                        break;
                         case 表达式:
                                  语句...
                        break;
                         case 表达式:
                                语句...
                        break;
                         case 表达式:
                                语句...
                        break;
                         case 表达式:
                             语句...
                        break;

            }

            switch在执行的时候会依次对Switch后面的表达式和case后面的表达式做全等比较
                        如果比较结果为true  就执行
                           如果比较结果为false  就跳过

                           注意：当比较结果为true时  会从当前case处开始执行代码  也就是case是代码执行的起始位置
                           可以使用break  语句来结束  switch语句

                            default  不符合要求的语句之后就执行这个
                            总结：switch和if语句功能是重复的  是一样的

* */

let boo=3;

switch (boo){

    case 1:
        console.log("你不好")
        break;

    case 2:
        console.log("你很好")
        break;

    case 3:
        console.log("你好！")
        break;

    case 4:
        console.log("你还好吗？")
        break;

    default :
        console.log("没有了")
        break
}

第五章：循环语句

1.while语句

/*
*           循环语句：
*                   通过循环语句可以使指定的代码反复执行
*                       js中一共有三种循环
*                           while语句
*                              do...while
*                           for循环
*
*           while(条件表达式){
*
*               语句....
*               }
*
*       执行流程  while在执行时  会先对条件表达式进行判断  如果循环为true  则执行循环体   执行完毕后继续判断  以此类推
*               直到条件表达式为false  就退出
*           当条件表达式位true的时候  就是一个死循环
*
*           循环三要素
*               初始化表达式
*               条件表达式
*               更新表达式
* */

/*
while (true){

    console.log("死循环！")
}*/


let a=0;//初始化表达式
while (a<100){//条件表达式
    console.log("第"+a+"遍")
    a++;//更新表达式
}

2.while练习

/*
* 假设银行存款 5%   问  存1000块  多少年可以变成5000块
*
* */




//创建一个变量 来表示钱数
let money=1000;
//
let i=0;
while (money<5000){

    money*=1.05
    console.log("第"+i+"年的钱为："+money)
    i++;
}

console.log("因此需要"+i+"年才能存到5000")

3.do…while循环

/*
*           do....while语句：
*                   语法：
*                       do{
*                           语句..
*                           }while(条件表达式)
*
*                           执行顺序：
*                   do..while在执行的时候 会先执行do后面的循环体
*                   执行完毕后  会对 while后的条件表达式进行判断
*                       如果为false循环终止
*       与while的区别是：这个是先执行在判断  执行的顺序是不一样的
*           实质区别：
*                   do...while语句可以确保循环至少执行一次
* 
* */


let i=0
do {
    console.log("第"+i+"遍")
    i++;
}while (i<100)

4.for循环