一、JavaScript概述
JavaScript是一种高级编程语言，常用于网页开发和服务器端应用程序。它是一种动态类型语言，可以在浏览器中直接解释执行，而不需要编译。
脚本（Script）是一种与计算机程序相关的指令集或代码块，用于执行特定的任务或操作。脚本通常用于自动化重复性的任务或进行特定功能的扩展。脚本语言是一种专门用于编写脚本的编程语言，与传统的编译型语言不同，脚本语言通常不需要编译，可以直接解释执行。脚本语言具有易学易用、灵活、动态和交互式等特点。
二、 怎么在网页中使用JavaScript
要在网页中使用JavaScript，有三种方法：行内式、内嵌式和外链式。
1、输出方式
在介绍使用方法前先讲一下 JavaScript 的3种输出方式：
（1）使用 console.log()：console.log()是JavaScript提供的一种输出到控制台的方法。它通常用于调试和测试代码，可以在浏览器的开发者工具控制台（按F12直接打开）中查看输出结果。
例如：
console.log("第一种：通过浏览器控制台进行输出！此方法最常用！"); 
（2）使用 alert()：alert()用于在浏览器中弹出一个警告框，显示指定的文本内容。它主要用于简单的弹窗提示，通常用于调试和测试代码。
例如：
alert("第二种：通过浏览器弹出框进行输出"); 
（3）使用 document.write()：document.write()方法可以将指定的内容直接写入到HTML文档中。它通常用于在网页中动态生成内容。
例如：
document.write("第三种：直接在网页页面中进行输出"); 
2、行内式（在HTML标签内添加脚本）
行内式是指在HTML标签的属性中直接使用JavaScript代码。这种方法适用于简单的、短小的代码片段，一般需要监听事件（非常不推荐，了解即可！）。
可以在HTML标签中使用事件属性（如onclick、onload等）来执行JavaScript代码。例如，要在按钮点击时触发一个弹出窗口：
<input type="submit" value="登录" onclick="javascript:alert('登录失败');"/>
点击登录时就会显示弹窗 “登录失败” 。
3、内嵌式（在HTML文档中嵌入脚本程序）
内嵌式就是可以在HTML文档中任意位置内嵌js脚本，添加<script>标签，并将JavaScript代码放在其中。
例如， HTML文档中打印输出内容：
<script>
document.write("你好，云中医计算机学院"); //document.write()向网页输出内容
</script>
4、外链式（链接脚本文件）
在实际开发中，为了更好地组织代码、提高可维护性，建议使用外链式将JavaScript代码放在外部文件中，并通过<script>标签的"src"属性引用外部文件。
创建一个 JavaScript 文件：首先，在你的项目中创建一个扩展名为 .js 的 JavaScript 文件。你可以使用任何文本编辑器来创建并编辑这个文件。例如，你可以创建一个名为script.js的文件。
编写 JavaScript 代码：在刚刚创建的 JavaScript 文件中，编写你想要运行的 JavaScript 代码。例如，你可以在script.js文件中编写以下代码：
document.write("外链式引用JS脚本");将 JavaScript 文件链接到 HTML 文件：在 HTML 文件中，添加一个<script>标签来链接你的 JavaScript 文件。在<script>标签中使用 src 属性来指定 JavaScript 文件的路径。
<!DOCTYPE html>
<html>
<head>
<title>JS的使用方式</title>
</head>
<body>
<!-- 其他HTML内容 -->
<script src="script.js"></script>
</body>
</html>
通过以上步骤，你就可以在网页中使用外链式（链接脚本文件）的方式来使用 JavaScript 了。这种方式适用于较大的 JavaScript 代码，可以将代码分离到不同的文件中，并通过链接到 HTML 文件中来使用它们。这样可以使代码更清晰、易于维护。
三、数据类型
在JavaScript中，有多种数据类型用于存储不同类型的值。
以下是JavaScript中的常见数据类型：
1. 字符串（String）：用单引号“ ' ”或者双引号“ " ”来说明，用于表示文本。
var str="Good morning!";
document.write(str + " -> 数据类型："+ typeof str + "<br>"); 
2. 数字（Number）：用于表示数字，可为整数和浮点数。 浮点数可以包含小数点，也可以包含一个e（大小写均可，表示10的幂），或者同时包含这两项。
// 小数
var x1=65.30;
document.write(x1 + " -> 数据类型："+ typeof x1 + "<br>");
// 数字
var x2=65;
document.write(x2 + " -> 数据类型："+ typeof x2 + "<br>");
// 117*10的3次方
var y=117e3;
document.write(y + " -> 数据类型："+ typeof y + "<br>");
// 117*10的-3次方
var z=117e-3;
document.write(z + " -> 数据类型："+ typeof z + "<br>");
3. 布尔值（Boolean）：用于表示真（true）或假（false）的值。
var x=true;
document.write(x + " -> 数据类型："+ typeof x + "<br>"); 
4. 对象（Object）：用于存储复杂数据和方法。
5. 数组（Array）：用于存储多个值的有序集合。
// 对象 object （对象类型下的数组类型）
var persons=new Array("Tom","Jack","Kate");
document.write(persons + " -> 数据类型："+ typeof persons + "<br>"); 
6. undefined：用于表示未定义的值。
var person1;
document.write(person1 + " -> 数据类型："+ typeof person1 + "<br>");
7. null：用于表示空值或不存在的对象。
// 特殊情况：尽管 null 是一个表示空值的特殊关键字，
// 但 typeof null 会返回 "object"。
// 这是一个著名的 JavaScript 特性，
// 虽然有些令人困惑，但已经存在了很长时间（知道一下就行，不必理会）
var person2=null;
document.write(person2 + " -> 数据类型："+ typeof person2 + "<br>");
了解和正确使用不同的数据类型是编写JavaScript代码的关键。这些数据类型使你能够在代码中存储和操作不同类型的值。
四、变量
JavaScript 中的变量用于存储和操作数据。使用变量可以在代码中存储和引用不同类型的值。
1、变量的命名
在JavaScript中，变量的命名需要遵循一些规则和约定。以下是一些关于变量命名的指导原则：
使用有意义的变量名：选择能够清楚描述变量用途的名称。这可以使代码更易读和易于理解。
变量名不能以数字开头：变量名必须以字母、下划线（_）或美元符号（$）开头。
变量名区分大小写：JavaScript是区分大小写的语言，因此
myVariable和myvariable是不同的变量。避免使用JavaScript保留字：JavaScript有一些保留字（如
var、function、if、true等），它们具有特殊的含义，不能用作变量名。使用驼峰命名法：在多个单词组成的变量名中，第一个单词小写，后续单词首字母大写。例如：
myVariable、firstName。
2、变量的声明
在 JavaScript 中，你可以使用 var、let 或 const 来声明变量。这些关键字的使用方式略有不同：
var：在整个函数作用域范围内都可见，如果变量在函数之外声明，它将成为全局变量。let：具有块级作用域，在花括号{}内部声明的变量仅在该块范围内可见。const：也具有块级作用域，用于声明常量，声明后的值无法修改。
例如：
var name = "John";
console.log("My name is " + name);
let age = 25;
age = age + 1;
console.log("Next year, I will be " + age);
const PI = 3.14;
console.log("The value of PI is " + PI);
在上面的例子中，name 是一个使用 var 声明的变量，age 是一个使用 let 声明的变量，PI 是一个使用 const 声明的常量。然后可以使用变量名来引用和操作其值。
使用 console.log 来将变量的值输出到控制台。输出的结果分别是：
变量提升现象：
变量提升是JavaScript解释器在执行代码之前的一个步骤，它会将变量和函数的声明提升到作用域顶部，但不会提升变量的初始化或赋值。
// 原来写的语句（变量先用后声明）
console.log(num);
var num = 10;
// 实际运行效果（变量提升现象）
var num;
console.log(num);
num = 10; 五、运算符
运算符是一种用于执行操作的符号或关键字。在JavaScript中，有多种类型的运算符，包括算术运算符、赋值运算符、比较运算符、逻辑运算符等。
下面用代码来操作解释：
算术运算符：
- 加法运算符：+
- 减法运算符：-
- 乘法运算符：*
- 除法运算符：/
- 取余运算符：%
- 自增运算符：++
- 自减运算符：--
加减乘除运算符：
<!-- 加减乘除运算符 -->
<script>
console.log(10 + 10); // 20
console.log(100 - 10); // 90
console.log(10 * 2); // 20
console.log(10 / 5); // 2
</script>取余运算符：
<!-- 取余运算符 -->
<script>
console.log(13 % 5); // 3
</script>自增自减运算符：
自增和自减运算符有一个需要注意的地方，就是放在变量之后，会先返回变量操作前的值，再进行自增/自减操作（先取值，后操作）；放在变量之前，会先进行自增/自减操作，再返回变量操作后的值（先操作，后取值）。
<script>
var a = 1;
var b = 1;
console.log(++a); // 2
console.log(--b); // 0
</script>
<script>
var x = 1;
var y = 1;
// 放在变量后
console.log(x++); // 1 即返回： x
console.log(x); // 2
// 放在变量前
console.log(++y); // 2 即返回： y+1
</script>
赋值运算符：
- 简单赋值运算符：=
- 加法赋值运算符：+=
- 减法赋值运算符：-=
- 乘法赋值运算符：*=
- 除法赋值运算符：/=
- 取余赋值运算符：%=
<script>
// 等同于 x = x + y
var x = 2;
var y = 1;
console.log(x += y); //3
// 等同于 x = x - y
var x = 2;
var y = 1;
console.log(x -= y); //1
// 等同于 x = x * y
var x = 2;
var y = 1;
console.log(x *= y); //2
// 等同于 x = x / y
var x = 2;
var y = 1;
console.log(x /= y); //2
// 等同于 x = x % y
var x = 2;
var y = 1;
console.log(x %= y); //0
</script>比较运算符：
- 相等运算符：==
- 不等运算符：!=
- 全等运算符：===
- 不全等运算符：!==
- 大于运算符：>
- 小于运算符：<
- 大于等于运算符：>=
- 小于等于运算符：<=
<script>
var num1 = 10 ;
var num2 = 10 ;
var num3 = "10";
console.log(num1 == num2); // true
console.log(num1 === num2); // true
console.log(num1 === num3); // false
</script>逻辑运算符：
- 逻辑与运算符：&&
- 逻辑或运算符：||
- 逻辑非（取反）运算符：!
取反运算符：
<!-- 取反运算符 -->
<script>
console.log(!undefined); // true
console.log(!null); // true
console.log(!0); // true
console.log(!NaN); // true
console.log(!""); // true
console.log(!888); // false
console.log(!'you are my baby'); // false
</script>其中，NaN的意思是“Not a Number”，即“非数值”或“不是一个数值”，它用于表示一个本来要返回数值的操作数未返回数值的情况。NaN通常出现在数学运算中，以下几种情况可能导致NaN的产生：除以0：在进行除法运算时，如果除数为0，那么结果就无法定义，通常会被设置为NaN。非法数学运算：当进行一些非法数学运算时，比如对负数进行平方根运算，结果也会被设置为NaN。数据类型不匹配：在类型转换时，如果类型转换失败或者转换后的结果不是有效数值，结果也会被设置为NaN。
数值溢出：当进行数值计算时，如果计算结果超出了所能表示的范围，结果也会被设置为NaN。
缺失数据：在某些数据分析任务中，如果数据中存在缺失值，那么在进行数据计算时，结果也会被设置为NaN。
且运算符（&&）：
<!-- 且运算符（&&） -->
<script>
console.log(10 < 20 && 10 > 5); // true
console.log(10 > 20 && 10 > 5); // false
</script>或运算符（||）：
<!-- 或运算符（||） -->
<script>
console.log(10 < 20 || 10 > 5); // true
console.log(10 > 20 || 10 > 5); // true
console.log(10 > 20 || 10 < 5); // false
</script>六、程序控制语句
1、if 和 if...else条件语句
if 和 if...else 是JavaScript中常用的条件语句，用来根据条件执行不同的代码块。
1. if语句： if语句根据给定的条件判断是否执行某个代码块。
语法：
if (条件) {
// 条件为真时执行的代码块
}
示例：
var num = 3;
if (num === 3)
{
num++;
}
console.log(num);运行结果：
2. if...else语句： if...else语句在条件为真时执行一个代码块，否则执行另一个代码块。
语法：
if (条件) {
// 条件为真时执行的代码块
} else {
// 条件为假时执行的代码块
}
示例：
// if...else...语句（及其嵌套使用）
var eat = true;
var food = "猪肉炖粉条";
if (eat)
{
if (food == "双椒鱼头")
{
console.log('就吃：双椒鱼头');
}
else
{
console.log("就吃：猪肉炖粉条");
}
}
else
{
console.log('还没到饭点');
}运行结果：
用三目运算符代替if...else...语句：
// 判断一个数是奇数还是偶数（if...else...语句实现）
var n = 100;
if (n % 2 === 0)
{
console.log("偶数");
}
else
{
console.log("奇数");
}
// 判断一个数是奇数还是偶数（三目运算符实现）
var n = 100;
console.log(n % 2 === 0 ? '偶数' : '奇数');在if语句和if...else语句中，条件可以是任何可以返回布尔值的表达式。当条件为真时，if语句或if...else语句中的代码块会被执行；当条件为假时，if...else语句中的else代码块会被执行（如果存在）
2、if...else if...和switch条件语句
1. if...else if...语句是一种多重条件判断的语句，用于根据不同的条件执行不同的代码块。当需要判断多个条件时，if...else if...语句比只有一个if...else语句更加灵活。
语法：
if (条件1) {
// 当条件1为真时执行的代码块
} else if (条件2) {
// 当条件1为假且条件2为真时执行的代码块
} else if (条件3) {
// 当条件1和条件2都为假且条件3为真时执行的代码块
} else {
// 当所有条件都为假时执行的代码块
}
示例：
// 多向判断语句 if...else if...else...
var greeting="";
var time=new Date().getHours();
if (time<12)
{ greeting="现在是上午"; }
else if (time<18)
{ greeting="现在是下午"; }
else
{ greeting="现在是晚上"; }
console.log(greeting); 2. switch语句是JavaScript中的条件语句，用来根据不同的条件执行不同的代码块。switch语句适用于需要判断多个可能取值的情况。
语法：
switch (表达式) {
case 值1:
// 当表达式等于值1时执行的代码块
break;
case 值2:
// 当表达式等于值2时执行的代码块
break;
...
default:
// 当表达式不等于所有case值时执行的代码块
break;
}
示例：
// 多向判断语句 switch
var x = 3;
switch (x)
{
case 0 : console.log("x为0");
break; //break语句用于跳出代码块或循环
case 1 : console.log("x为1");
break;
default : console.log("x既不是0也不是1");
}运行结果：
3、for循环语句
for循环语句用于重复执行一段代码块，可以根据指定的条件来控制循环执行的次数。
语法：
for (初始化语句; 循环条件; 循环后操作) {
// 循环体代码块
}
- 初始化语句：在循环开始之前执行一次的语句，通常用于设置循环变量的初始值。
- 循环条件：在每次循环开始之前检查的条件，只有当条件为真时才会执行循环体代码块。如果条件为假，则跳出循环。
- 循环后操作：在每次循环结束之后执行的操作，通常用于更新循环变量的值。
（都不写的话，就是永久循环（死循环），不推荐这种写法。）
示例：
// 递增输出1~10
for(var i=1;i<=10;i++)
{
console.log(i);
}运行结果：
永久循环（死循环），如果确实需要永久循环，推荐这种写法：
while (1)
{
console.log('每天早上对你说一句肉麻话: 我爱你,中国');
}