JavaScript
什么是JavsScript
JavaScript是一种轻量级、解释型、面向对象的脚本语言。它主要被设计用于在网页上实现动态效果，增加用户与网页的交互性。
作为一种客户端语言，JavaScript可以直接嵌入HTML，并在浏览器中执行。
与HTML和CSS不同，JavaScript使得网页不再是静态的，而是可以根据用户的操作动态变化的。
JavaScript的作用
JavaScript在前端开发中扮演着重要角色，其应用领域包括但不限于以下三种：
'客户端脚本'：用于在用户浏览器中执行，实现动态效果和用户交互。
'网页开发'：与HTML和CSS协同工作，使得网页具有更强的交互性和动态性。
'后端开发'：使用Node、JavaScript也可以在服务器端运行，实现服务器端应用的开发。
JS导入方式：
第一种是内联式，在html文件中直接嵌入JS代码，JS代码放在script标签内，script标签可以在head，也可以在body标签内
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>JS导入方式</title><script>console.log('Hello, Head 标签的内联样式')</script><!-- 外部引入,导入外联样式 --><script src="./js/myscript.js"></script>
</head><body><h1>JavaScript 的导入方式</h1> <script>// console.log表示在控制台打印一些日志内容console.log('Hellp, body标签的内联样式')alert("你好，内联样式弹窗");</script>
</body>JS基本语法
<script>// 变量，var生成的变量是具有函数作用域var x;// 变量，let生成的变量具有块级作用域，let更安全更灵活，它避免了var可以引发的一些问题，特别是关于变量提升和块级作用域的方面let y = 5;// 常量const pI=3.14// 打印出x,y,pI，打印结构 undefined、5、3.14。undefined的意识就是一个空值，未定义的状态，它是JS中的一种数据类型表示变量声明但没有初始化。console.log(x , y , pI);// 创建一个字符串let name='小刘';console.log(name);// 创建一个空值// null与undefined的区别，虽然他们两个都是表示缺失值的特殊值，但是他们在含义上还是有区别的，// undefined表示一个变量已被声明但尚未被赋值或者一个对象属性不存在,当函数没有返回值的时候,默认返回的也是undefined// null表示一个变量被明确赋值为空或者不存在,它是一个被赋予的值,表示一个空对象引用或者没有对象值// undefined表示变量可能在将来被赋值,或者表示某个值还没有被计算出来.而null,明确表示没有对象值// 在实际开发中根据语境选择哪个值let empty_value = null;console.log(empty_value);</script>JS控制语句
JS控制语句：包括条件语句和循环语句
条件语句
条件语句都会使用，if、else if、和else三个关键字。
'if'语句：用于执行一个代码块，当指定的条件为真(true)时执行。语法如下：
if(condition){//如果条件为真，执行这里的代码
}'else'语句：用于在上一个If和所有的else if都为假时执行的代码块。语法如下：
if (condition){//如果条为真，执行这里的代码
}else{//如果条件为假，执行这里的代码
}'else if'语句：用于在上一个if语句条件为假时，检查另一个条件。可以有多个else if语句。语法如下：
if (condition1){//如果条件1为真，执行这里的代码
}else if (condition2){//如果条件2为真，执行这里的代码
}else{//如果以上条件都为假，执行这里的代码
}代码示例：
let age = 18;//大于等于十八则输出你已经成年了,否则输出未成年if (age >= 18) {console.log('你已经成年了');}else{console.log('未成年');}let time = 22;if (time < 12) {alert('上午好');} else if (time <18) {alert('下午好');} else {alert('晚上好');}循环语句
循环语句用于重复执行一段代码，直到指定的条件不再满足为止。
for
'for'循环：是一种常见的循环语句，用于按照指定的条件重复执行代码块。语法如下：
for(初始化表达式；循环条件；迭代器){//循环体，执行这里的代码
}代码示例：
console.log('for 循环');// i=0初始化我们这个循环变量为i,并且初始值为0;循环条件,当i<10时,我们就执行这个for循环,每执行完一次 就执行一次i++// i++就是i=i+1的简写,也可以为i+=1for (let i = 1; i<11;i++){console.log(i);}while
'while'循环会在指定的条件为真的执行代码块。语法如下：
whileO(循环条件){//循环体，执行这里的代码
}代码示例：
// while死循环console.log('while 循环');let count = 1;while (count <= 10){console.log(count);// 迭代条件count++}break与continue
循环关键字
'break'用于跳出循环，结束循环进行。
'continue'用于跳过当前循环中的剩余代码，继续下一次循环。
代码示例：
console.log('循环关键字');for (var i = 0;i<5;i++){// i=2跳过这个代码if ( i == 2){continue;}// i=4终止这段代码if (i == 4){break;}console.log(i);}函数
'函数'是一段可重复使用的代码块，它可接受输入(参数)、执行特定任务，并返回输出。
function function_name(参数1，参数2，参数3，...){//参数可以不写，表示不传参//函数体，执行这里的代码return 返回值;//可选，返回值
}代码示例如下：
<SCript>function hello(){console.log('hello world!');}
//调用这个函数hello()function hello_with_return(){return 'hello world! - 返回值'}// 用a这个变量接收这个返回值let a = hello_with_return();// 添加返回值console.log(a);console.log(hello_with_return());//传参 function hello_with_params(name){console.log('hello,' + name);}// 调用 hello_with_paramshello_with_params('如花');hello_with_params('Alice');// 作用域let global_var = '全局变量';function local_var_function(){// 局部作用域let local_var = '局部变量';console.log('函数内打印全局变量：' + global_var);console.log('函数内打印局部变量：' + local_var);}// 调用local_var_function();console.log('全局打印全局变量：' + global_var);// 因为local_var在局部作用域里面，在外部访问不到console.log('全局打印局部变量：' + local_var);</SCript>事件
事件是文档或者浏览器窗口中发生的特定瞬间，例如用户的点击、键盘的按下、页面的加载等。常见的时间如下：
| 事件 | 描述 |
| onClick | 点击事件 |
| onMouseOver | 鼠标经过 |
| onMouseOut | 鼠标移出 |
| onChange | 文本内容改变事件 |
| onSelect | 文本框选中 |
| onFocus | 光标聚集 |
| onBlur | 移开光标 |
事件的绑定
JS绑定事件的方法有三种：
1、'HTNL'属性
2、'DOM'属性
3、'addEventListener'方法
代码示例：
<body><button onclick="click_event()">这是一个点击事件按钮</button><input type="text" onfocus="focus_event()" onblur="blur_event()"><script>// 点击事件function click_event() {alert('点击事件触发了');}// 聚焦事件function focus_event(){console.log('获取焦点');}// 失去焦点function blur_event(){console.log('失去焦点');}</script>
</body>注：刚开始接触前端，希望有大佬提出建议，本人虚心学习。
)
)
![[信号与系统]模拟域中的一阶低通滤波器和二阶滤波器](http://pic.xiahunao.cn/[信号与系统]模拟域中的一阶低通滤波器和二阶滤波器)
