引言
JavaScript，简称 JS，它是一个脚本语言，通过编写代码，在浏览器上运行。
一、JS 引入方式
1. 内嵌式
内嵌式是指：将 JS 代码写在 script 标签的内部。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>demo8</title> </head> <body> <script> //alert 的功能是弹出一个对话框 alert("hello world"); </script> </body> </html>
展示结果：
2. 行内式
行内式是指：将 JS 代码入到 html 中，但不通过 script 标签。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>demo9</title> </head> <body> <input type="button" value="按钮" onclick="alert('hello! 欢迎来到这个页面')"> </body> </html>
展示结果：
3. 外部式
(1) 创建一个 js文件，在 js文件中，书写代码。
(2) 在 html 文件中，通过路径引入 css 文件。
js 文件
alert("hello world");
html 文件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>demo10</title> </head> <body> <script src="demo10.js"> alert("welcome to the world"); </script> </body> </html>
在通过 src 文件引入 【hello world】之后，同一 script 标签中的其他相同命令不会生效。比方说：上面的 【alert(“welcome to the world”)】就并没有生效。
展示结果：
二、JS 基础语法
1. 注释
和 Java 相同，既可以使用 【//】，也可以使用【/* */】
2. 输入输出
// 弹出一个输入框 prompt("请输入你的名字"); // 弹出一个输出框 alert("hello world");
展示结果：
3. 在控制台上打印
console.log("hello world");
展示结果：
注意
①【console.log()】的用法和 Java 中【System.out.println()】的用法基本相似，都是具有打印并换行的显示效果。
② console 是一个 JS 中的 “对象”。其中. 表示取对象中的某个属性或者方法，我们可以直观地将 . 理解成 “的”。那么，console.log 就可以理解成：使用 “控制台” 对象 “的” “log 方法”。
4. 变量的使用
基本数据类型
创建变量
let num = 10; //var num = 10; num = 20; console.log(num); let str = 'hello world'; console.log(str);
展示结果：
var / let 是 JS 中的一个关键字，它的作用是声明这是一个变量。var 的使用，年代较为久远，后面建议使用 let，以免不必要的缺陷发生。
在 JS 中，创建变量不需要显示指定类型。变量实际的类型，根据初始化 / 赋值来确定的。而这一特性实际上就是因为 JS 是基于动态类型这一语法的。
在上面的程序中，将变量 num 赋值成数字，那么 num 就表示 number 类型；将变量 str 赋值成字符串，那么 str 就是字符串类型。
理解动态类型
理解动态类型之前，先来看看 Java 的静态类型语言：
在 Java 中，一个变量的类型，在编译阶段就固定了，在运行时不能改变。例如：下面的变量 a 就是一个 int 类型，在后面的编译阶段中，不管怎么修改 a 的值都是可以的，但当前 a 的类型始终是 int 类型，这无法改变。
int a = 10;
而在 JS 中，变量的类型随着程序运行，随时可以改变。这其实就是动态类型的含义。
let a = 10; console.log(a); //typeof 可以展示当前变量的类型 console.log(typeof a); a = 'hello world'; console.log(a); console.log(typeof a);
展示结果：
5. number 类型的规则
(1) 进制表示
和 Java 类似，不再赘述。
let a = 07; // 八进制整数, 以 0 开头 let b = 0xa; // 十六进制整数, 以 0x 开头 let c = 0b10; // 二进制整数, 以 0b 开头
(2) 特殊的数字值
Infinity: 无穷大, 大于任何数字。表示数字已超过了 JS 能表示的范围。 -Infinity: 负无穷大, 小于任何数字。表示数字也已超过了 JS 能表示的范围。 NaN: 表示当前的结果不是一个数字。
console.log(10/0); console.log(-10/0); console.log('hello' - 10);
展示结果：
(3) 小数
console.log(1/3);
展示结果：
6. string 类型的规则
(1) 创建字符串
字符串需要使用引号引起来，单引号双引号都可以。因为在 JS 的语法中，没有字符的概念，只有字符串。
let str1 = 'hello'; let str2 = "hello world";
也可以单引号双引号配合使用：
console.log(" welcome to 'Shanghai' "); console.log(' welcome to "Shanghai" ');
(2) 求字符串长度
let str = 'hello 杰克'; console.log(str.length); //输出结果：8
(3) 拼接字符串
let str1 = "hello "; let str2 = "杰克"; console.log(str1+str2); let str3 = "hello "; let str4 = "Jack"; console.log(str3+str4); let str5 = "My score is " let str6 = 100; console.log(str5+str6);
展示结果：
7. boolean 类型的规则
boolean 类型除了用来表示 true 或 false 以外，还能够分别表示 0 或 1.
let a = true; let b = false; console.log(a + 1); console.log(b + 1);
展示结果：
8. undefined 和 null 类型
let a; console.log(a); let b = null; console.log(b + 2); console.log(b + '2');
展示结果：
两者的区别与联系
共同点：null 和 undefined 都表示取值非法的情况，但是侧重点不同。
不同点：null 表示当前的值为空，相当于一个空的盒子。
undefined 表示当前的变量未定义，相当于连盒子都没有。
9. 运算符与符号
JS 中的算术运算符、赋值运算符、自增自减运算符、比较运算符、逻辑运算符、移位运算、转义字符。这些和 C 语言、 Java 的语法都基本一致，虽有个别地方不相同，但不影响，可以自己在实际编程中发现差异。
比方说：
展示1
JS 中有一个【===】号，它与两个等号的差异：
== :比较相等(会进行隐式类型转换) === :比较相等(不会进行隐式类型转换)
let x = 10; let y = '10'; console.log(x == y); console.log(x === y);
展示结果：
展示2
a || b
如果 a 为 true， 整个表达式的值就是 a 的值。
如果 a 为 false，整个表达式的值就是 b 的值。
所以在 JS 中，|| 得到的结果，不一定就是 boolean 类型。
10. 语句
JS 中的 if 语句、三元表达式、switch 语句、while循环、for 循环。这些都与 C语言的语法基本一致。
在 if 语句、while 循环中的判断条件中，存在 【0为假，非0为真】的逻辑。
let a = 1; let b = 0; if(5) { console.log(100); } else { console.log(200); } while ( a <= 10) { console.log(a); a++; }
展示结果：
