1. js的四种引入方式：（1）行内：直接将js代码写在html标签中（2）内嵌：js代码用<script></script>包裹，可以在头部里面，也可以在body里任何位置，也可以写在body之后。一般放在body最后一行。（3）外部引入：单独建一个script.js文件，在html页面通过<script src=”script.js”></script>引入js.注意引入js路径的<script src=”script.js”></script>标签之间不能再编写js内容了。一般放在body最后一行。如果需要就在在用另对<script></script>标签包裹要编写的js内容。
（4）a标签的js引入：<a href="javaScript: /*代码块*/;"></a>2.js注释
（1）单行注释    //                ctrl + / 
（2）多行注释     /*  */          shift + alt + Avscode里面可以修改快捷键3.js输入、输出语句（1）输入框 prompt()（2）弹出框 alert()     输出框    给用户看的（3）console.log()      控制台打印输出   给程序员看的

JS变量
1.什么是变量？
变量就是一个用来存储数据的盒子/容器。可以用变量来存储用户输入的数据，也可以通过变量输出用户输入的数据。变量里面可以装任何东西。
变量的本质：内存的一块存储空间，用来存储数据
声明变量的本质：向内存申请存储数据的空间
2.变量的使用？
（1）声明变量 关键字 var
var 变量名;
var age ;
（2）赋值 =
var 变量名=要存储的值;
age = 18；
（3）变量初始化：声明变量并赋值
var age=18;
（4）输出变量
console.log(age);
（5）变量的案例——简单对话框

 //用户输入框存储数据var name = prompt("请输入您的姓名");//用户提示框/弹出框alert(name);//控制台输出console.log(name);

（6）变量的语法扩展（a）变量的更新当同一变量有过多个值时，输出的变量值是最后赋予的值，即后面的值会覆盖前面的值。（b）同时声明多个变量：只用一个var,变量之间用逗号隔开var  变量1 = 值1，变量2 = 值2，...（c）声明变量的特殊情况：只声明不赋值    var age;    输出age为undefined不声明也不赋值    age;       输出age时要报错不声明只赋值    age=18；   输出age为18（不建议使用）既声明又赋值    var age = 18;  输出age为18（建议最好使用）
（7）变量的命名规范（a）大小写字母、下划线、数字、$符号组成（b）不能以数字开头（c）严格区分大小写（d）不能是关键字或保留字  比如var（e）名字要有意义，一眼看出代表什么（f）驼峰命名法，第二个单词及其以后的首字母为大写（g）name在js中有特殊含义，尽量不要用name声明变量

<script>//交换变量//创建一个临时变量var temp;//装青苹果的变量var auqaApple = '青苹果';//装红苹果的变量var redApple = '红苹果';//把青苹果的给temptemp = auqaApple;//把红苹果给auqaAppleauqaApple = redApple;//把青苹果给redAppleredApple = temp;console.log(auqaApple);console.log(redApple);</script>

    输出结果：

JS数据类型
1.js的变量的数据类型是只有在程序在运行时（js引擎渲染时）根据变量等号右边的变量值来确定。
2.js的变量的数据类型是动态的，可以改变。
3.为什么要有数据类型？
不同的数据类型会占据不同的存储空间，为了更好利用存储空间，需要不同的数据类型。
4.数据类型的分类：
（1）简单数据类型：

数字型 number 浮点型、整型 默认值为0
布尔型 boolean true/false 1/0 默认值为false
字符型 string 变量值用引号括起来的内容 默认值为""
undefined undefined 未定义 默认值为undefined
null null 空字符 默认值为null
（2）复杂数据类型：
对象类型 object 数组

5.number类型
（1）var  age = 18;        age为数字中的整型var  PI = 3.14;         PI为数字中的浮点型
（2）数字进制：二进制、八进制、十进制、十六进制（a）二进制     0和1组成(b)  八进制    js中在数字首部填一个0代表八进制八进制转换为十进制  :     0~7     逢8进1var   num = 012;        1*8+2   ===>   输出num为10var   num = 010;         1*8+0  ===>    输出num为8（c）十六进制     0~9  a~f(代表10~15)   js中在数字首部添加0x代表十六进制十六进制转换为十进制 ：var  num = 0x9;    ===>  输出num为9var  num = 0xf;    ===>  输出num为15var  num = 0xdd;           16*13+13   ===>  输出num为221(3)  数字最大值和最小值Number.MAX_VALUENumber.MIN_VALUE
（4）无穷大和无穷小无穷大：infinity无穷小：-infinity
（5）isNaN(x)   判断数据x是否是非数字，如果x是非数字，则返回true;如果x是数字，则返回false6.字符串类型
（1）字符串用双引号或者单引号包裹     比如： “12”是字符串而不是数字
（2）字符串中引号的嵌套单引号里面嵌套双引号，双引号里面嵌套单引号。（外单内双，外双内单。并且执行就近原则：js中前一个单引号会找下一个离它最近的单引号关闭）js中建议使用单引号，html中建议使用双引号“我是一个‘程序员’”  或者  ‘我是一个“程序员”’
（3）转义字符转义字符是写在引号里面的\n    ===>   换行\\    ===>    反斜杠\'     ===>    单引号(英文)\"     ===>    双引号（英文）\t      ===>    tab  缩进\b     ===>    blank 空格
（4）字符串的length属性string的length属性可以用来计算字符串的长度（包含多少个字符，字符包括空格和标点符号）
（5）字符串的拼接通过加号+可以拼接多个字符串字符串类型 + 任何类型 = 字符串类型数值相加的结果是数值，字符相加的结果是字符'12' + 12  ===>  121212 + 12  ===>    24'12' - 12 ===>    0    隐式转换'pink' - 12  ===>  NaN       (6)  字符串拼接加强在字符串中添加变量，方便修改值变量不加引号，变量在引号外面引引加加         '我是一个' + age + ’岁的程序员' 

//用户输入数据,将数据用变量存储起来var age = prompt("请输入你的年龄");//程序处理数据var str = '您今年已经'+ age +'岁了';//输出结果  回答alert(str);

7.布尔型（1）值为true/false    默认值为false布尔型 + number型 = number型true + 1 = 2     ===>  1 + 1 = 2    布尔型参与加法运算时会变为1/0flase  + 1 = 1   ===>  0 + 1 = 1布尔型 + 字符串型 = 字符串型true + 'zifuchuan'  ===>   truezifuchuan
8.undefined型（1）没赋值的变量为undefined型（2）赋值为undefined的变量为undefined型（3）undefined型 + number型 = NaN    结果是一个非数字（4）undefined型 + 字符串型 = 字符串型
9.null型（1）赋值为null的变量为object型（2）null + number = number本身      null代表空值（3）null + 字符串 = 字符串
10.typeof : 查看变量的类型

var num = 18;console.log(typeof num);//numbervar str = '18';console.log(typeof str);//stringvar boln = true;console.log(typeof boln);//booleanvar unde = undefined;console.log(typeof unde);//undefinedvar kong = null;console.log(typeof kong);//objectvar array = [];console.log(typeof array);//object

表单、prompt输入框输入的内容为字符串型，这时就需要转换数据类型。

JS数据类型转换
1.字面量
固定值的表示法。表示如何表达一个值。可以理解为变量等号右边的值。
(1)数字字面量 例如：10 , 8 …
(2)字符串字面量 例如：‘english’ , ‘黑马程序员’…
(3)布尔字面量 例如：true/false
(4)对象字面量 例如： var person= { name : ’ ',id : ’ ', … }
(5)数组字面量 例如：var array = [a,b,c…]
(6)函数字面量 function
2.数据类型转换为字符串型
（1）toString() 格式：变量.toString()
（2）String() 格式：String(变量)
（3）+ 加号连接字符串 隐式转换 格式：变量 + ‘ ’

var num = 18;console.log(typeof num);//number/* num = num.toString();console.log(typeof num) *//* num = String(num);console.log(typeof num); */			console.log(typeof (num + ''));

3.数据类型转换为数字型
（1）parseInt(string) 转换为整型 向下取整 格式：parseInt(变量)
parseInt（‘18’） === > 18
parseInt（‘18.18’）=> 18
parseInt（‘18.88’）=> 18
可以识别去掉后面的非数字字符
parseInt（‘120px’）=> 120
不可以识别去掉首部的非数字字符
parseInt(‘rem120px’) => NaN
（2）parseFloat(string) 转换为浮点型 格式：parseFloat(变量)
parseFloat（‘18.18’）=> 18.18
可以识别去掉后面的非数字字符
parseFloat（‘120px’）=> 120
不可以识别去掉首部的非数字字符
parseFloat(‘rem120px’) ===> NaN
（3）number(变量) 强制转换 格式：number(变量)
number(‘123’) ===> 123
（4）-(减法)、*(乘法) 、/(除法) 利用算术运算隐式转换为数值

<script>console.log('18'-2);//16console.log('18'*2);//36console.log('18'/3);//6</script>

4.计算年龄

<script>//计算年龄//用户输入出生年,用变量将用户输入的数据保存下来var year = prompt("请输入您的出生年");//将输入的年份转换为数值型//year = parseInt(year);//获取当前年份var curYear = new Date().getFullYear();//程序处理  用当前年份减去出生年份 将结果用一个变量保存下来var age = curYear - year;//这里有减法的隐式转换，所以可以不用转换year的数据类型//输出结果alert('您今年' + age + '岁了!')</script>

5.计算任意两个数的和

//输入第一个值并用变量num1保存起来var num1=prompt("请输入第一个加数");//将第一个数字转换为数字型num1 = parseFloat(num1);//输入第二个值并用变量num2保存起来var num2=prompt("请输入第二个加数");//将第二个数字转换为数字型num2 = parseFloat(num2);//程序处理  num1和num2相加并将结果保存在sum中var sum=num1 + num2;//输出最后的和alert(num1 + '+' + num2 + '=' + sum);

6.数据类型转换为布尔型
（1）Boolean(变量) ===> 将其他类型转换为布尔型
（2）!!变量 ===> !!123 ===true
代表空、否定的值转换后输出的都是false,如：“”，null，undefined，0，NaN。除了这五个值，其他类型转换为布尔类型输出的值都是true.

<script>console.log(Boolean(''));//falseconsole.log(Boolean(null));//falseconsole.log(Boolean(undefined));//falseconsole.log(Boolean(NaN));//falseconsole.log(Boolean(0));//falseconsole.log(Boolean('123'));//trueconsole.log(Boolean('小白'));//trueconsole.log(Boolean(123));//true</script>

（2）“!!变量”   ===>   得到的是变量转为其本身布尔值

拓展：
编译型语言：JAVA 将所有程序代码写好后，编译器编译后才执行。
（相当于把所有的菜做好以后才能吃）
解释型语言：JavaScript 写一行代码JS渲染引擎渲染执行一行代码。
（相当于做好一个菜吃一个菜，边做边吃）

JS 标识符、关键字、保留字
1.标识符：程序员开发时为变量、属性、函数、参数取的名字。
标识符不能是关键字和保留字。
2.关键字：JS本身已经使用了的字。不能再作为变量名、方法名。
比如：var 、break 、while 、for…
3.保留字：JS预留的关键字，现在不是关键字，但未来可能会成为关键字。不能再作为变量名、方法名。
比如：let…

<script>//输入用户姓名,用一个变量保存用户输入的姓名var userName = prompt("请输入您的姓名");//输入用户的年龄,用一个变量保存用户输入的年龄var age = prompt("请输入您的年龄");//输入用户的性别,用一个变量保存用户输入的性别var sex = prompt("请输入您的性别");//程序处理后输出用户的信息alert("您的姓名是："+ userName +"\n您的年龄是："+ age +"\n您的性别是："+ sex);</script>

JS运算符
1.算术运算符
+ 、-、*、/、%(取余)
注意：3%5=3
浮点型的数据使用算术运算符的时候会出问题，浮点型数据最高精确到小数点17位。
0.1+0.2 =0.30000000000000004
而不等于0.3
在做算术运算的时候最好不要用浮点数
我们不能直接拿浮点数来作比较 是否相等
优先级：先乘除后加减，有括号先计算加号里面的
2.表达式和返回值
（1）表达式：由数字、运算符和变量组成的结果为数值的有意义的式子
比如：1+1
（2）返回值：表达式有一个结果，这个结果就是返回值
比如：1+1=2 ===> 2就是1+1这个表达式的返回值
3.递增(++)递减(–)运算符（变量自身反复加1或减1）
（1）前置递增运算符，++写在变量前面，比如++num。前置递减（–num）运算同理。
var num = 6;
num = num +1; ===> ++num
结果：num为7 ===> 结果：num为7
（2）后置递增运算符，++写在变量后面，比如num++。后置递减运算同理
var num = 6;
num = num +1; ===> num++
结果：num为7 ===> 结果：num为7
注意：如果前置递增与后置递增单独使用，效果一样；
如果前置递增或后置递增与其他数值进行运算时，效果就有区别了
前置递增（先己后人）：先自加1再返回结果值，再用这个结果值做其他的运算；
后置递增（先人后己）：先返回原值，用原值做其他的运算后，原值再自加1。
前置递减：先自减1再返回结果值，再用这个结果值做其他的运算；
后置递减：先返回原值，用原值做其他的运算后，原值再自减1。

<script>var b = 6;++b;//++b的结果是7   b的结果也是7var c = 6;c++;//c++的结果是7   c的结果也是7var num = 6;console.log(++num + 2);//9console.log(num);//7var a = 6;console.log(a++ +2);//8console.log(a);//7var x = 6;console.log(--x +2);//7console.log(x);//5var y = 6;console.log(y-- +2);//8console.log(x);//5var e = 10;f = e++ + ++e;//e++返回10之后e的值已经为11，++e也就等于12，结果为10+12=22console.log(f);//22</script>

4.比较运算符

== 数值与字符数字作比较时，双等会将字符串类型的值转换为数字型，所以
‘18’ == 18 ===> 输出结果为true
5.逻辑运算符(布尔值类型参与运算)
与：&& 或：| | 非：!

6.逻辑中断（会影响程序运行的结果）
（1）逻辑与&& 的短路运算（值或直接得出值的表达式参与逻辑运算）
多个表达式（值非布尔值）用&&相连接时，如果左边的表达式能直接得出数值或者左边的表达式直接为数值，那么不管&&右边有多少表达式进行运算都不管了。
表达式1 && 表达式2…
如果表达式1为真，输出结果为表达式2；
如果表达式1为假，输出结果为表达式1。

<script>console.log(123 && 456);//456	console.log(123 && 456 && 789);//789console.log(0 && 123);//0console.log('' && 123);//''console.log(0 && 123 && '');//0console.log('' && 123 && 0);//''</script>

表达式1结果为非0数值时，输出结果为表达式2的结果
表达式1结果为0，‘ ’，null，undefined，NaN时，输出结果为表达式1的结果
（2）逻辑或| | 的短路运算
表达式1 | | 表达式2…
如果表达式1为真，输出结果为表达式1；
如果表达式1为假，输出结果为表达式2。

console.log(123 || 456);//123	console.log(123 || 456 || 789);//123console.log(0 || 123);//123console.log('' || 123);//123console.log(0 || 123 || '');//123console.log('' || 123 || 0);//123

（3）逻辑中断很重要，他会影响程序的运行结果

var num = 10;console.log(8 || num++);//8console.log(num);//10 因为或||逻辑中断,num++还没有实现就被中断了,所以num还是等于10

7.赋值运算符

8.运算符的优先级

一元运算符：只有一个操作数，比如：++num 只有num一个操作数
二元运算符：有两个操作数，比如 a+b 有a和b两个操作数
三元运算符：有三个操作数
关系表达式 ？关系表达式为真时执行 ：关系表达式为假时执行

<script>var a=6;var b=8;a>b ? a=10 : b=10;console.log(a);//6console.log(b);//10</script>

一元运算符中 ! 的优先级最高,逻辑运算符中 ! > && > | |

流程控制
1.流程控制：让代码按照一定的顺序（情况）执行。
2.顺序结构：按照代码的书写顺序，从上往下，一条代码一条代码地执行。
3.分支结构：代码从上往下执行的过程中，可以根据不同的条件，执行不同的代码块，得到不同的结果。
if(条件){ 代码 } //条件为真时执行花括号里的代码，条件为假时不执行。
双分支：（执行语句二选一）
if(条件){代码1}else{代码2}//如果条件为真执行代码1，否则 执行代码2。
多分支：（执行语句多选一）
if(条件1){ 代码1}else if(条件2){代码2}…else{ 代码n} //当所有条件都不为真时，执行代码n。
多个条件最好按照从大到小的思路去写。

 var stuScore = parseFloat(prompt('请输入某同学的成绩'));if(stuScore>=0 && stuScore<=100){if(stuScore>=90 && stuScore<=100){alert('该同学成绩为A');}else if(stuScore>=80){alert('该同学成绩为B');}else if(stuScore>=70){alert('该同学成绩为C');}else if(stuScore>=60){alert('该同学成绩为D');}else{alert('该同学成绩为E');}}else{alert('成绩在0~100以内，请输入正确的成绩范围!!!');} 

switch(表达式){
case value1:
执行语句1;
break;
case value2:
执行语句2;
break;
…
default:
上面所有的value值都不匹配时执行;

}
switch语句执行思路：
用表达式的值去匹配case后面的value值，能匹配哪一个就执行那块代码。
适用于针对变量有一系列的特定值的选项时使用。
switch使用的注意事项：
（1）开发时，一般将表达式写成变量
（2）表达式的值和case后面的value值是全等，数据类型和值都相同
（3）如果当前case没有写break,不会退出switch,不管有没有匹配上value值，都会继续执行下一个case。

switch语句和if … else if 语句的使用环境
（1）一般情况下，两者可以互换使用
（2）当变量的值是特定的固定值时用switch;当条件为范围时使用if … else if
（3）当分支少的时候用if … else if，效率更高
（4）当分支多的时候用switch,效率比较高而且结构比较清晰
4.循环的结构
循环的目的：让一些代码重复执行。