JS
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-XcqUhsF3-1666188705817)(C:\Users\Administrator\AppData\Roaming\Typora\typora-user-images\1664241768134.png)]
1.1：
1.alert()浏览器
2.doucument.write()向页面
3. console向控制台输出一个内容
console.log("")
1.2：
1.将JS代码编写到标签的onclick属性中，点击时，js代码才会执行
<button onclick="alert('等哈说');">hbbb</button>
2.写在超链接href属性中，点击超链接时，会执行JS代码
<a href="javascript:alert('点击');">和工行建行</a>
虽然可以写在标签的属性中，但是属于结构与行为耦合，不方便维护
所以一般推荐外部文件引入
1.3:将JS代码编写到外部JS文件中，通过script标签引入
可以在不同也买那种同时使用，也可以利用浏览器的缓存机制
<script type="text/javascript" src="js/script.js"></script>
script标签一旦引入外部文件中，就不能在编写代码了，即使编写了浏览器也会忽略
2:基本语法
2.1:注释：
//单行
/*山东黄金/
2.2:注意：
- JS中严格区分大小写
- JS每一条语句以分号结尾
- JS中会忽略多个空格和换行
2.3：字面量和变量
字面量，都是不可改变的值，如1，2，3，4，5
变量，用来保存字面量，值可以任意改变，更加方便使用
使用var关键字来声明一个变量
var a; a=1; console.log(a);var b = 9;
2.4：标识符
在JS中所有的可以由我们自主命名的
列如：变量名，函数名，属性名
规则：
１．标识符中可以含有字符，数字，｀＿｀，＄
２．不能以数字开头
３. 不能是ES中的关键字或保留字
４. 标识符一般采用驼峰命名法
JS底层保存标识符实际上是采用unicode编码
var 觉得很充实的 = 789; console.log(觉得很充实的); //不建议这么用
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-pqMe2gZT-1666188705818)(C:\Users\Administrator\AppData\Roaming\Typora\typora-user-images\1664244312539.png)]
2.5：数据类型(6)
基本数据类型：
字符串
String
双引号和单引号都可以，不要混着用
引号不能嵌套
打印
\要用两个\\
Number
数值
整数和浮点型
Infinity正无穷
-Infinity负无穷不用JS进行高精度运算
布尔值
Boolean
NULL和Undefined
空值和未定义
引用数据类型;
Object
对象
转换类型：
1.NaN表示一个非数字，一般是算术运算执行的结果。但NaN是属于数值类型。
2.在执行算术运算时，只要有NaN参与其结果就是NaN。在加法运算时，有字符串参与时就会执行字符串拼接。
3.NaN永远不等于NaN。1.NaN表示一个非数字，一般是算术运算执行的结果。但NaN是属于数值类型。
2.在执行算术运算时，只要有NaN参与其结果就是NaN。在加法运算时，有字符串参与时就会执行字符串拼接。
3.NaN永远不等于NaN。
2.6：运算符（操作符）：
定义一个或多个值进行运算，并获取运算结果
typeof就是
算数运算符
+，-，*，/
一元运算符
+正号
-负号可以用其将非数值型转换为数值型
逻辑运算符
- 非运算符：
！非运算可以对布尔值进行取反，- 与运算符：
&&- 或运算符：
||
赋值运算符：=
关系运算符：>，>=，<=，<
用来比较两个值之间的关系， 如果关系成立则返回true，关系不成立则返回false。 如果比较的两个值是非数值，会将其转换为Number然后再比较。 如果比较的两个值都是字符串，此时会比较字符串的Unicode编码，而不会转换为Number。
相等运算符：==
相等，判断左右两个值是否相等，如果相等返回true，如果不等返回false 相等会自动对两个值进行类型转换，如果对不同的类型进行比较，会将其转换为相同的类型然后再比较，转换后相等它也会返回true，null == undifined
三元表达式(条件运算符）:?
语法：条件表达式?语句1:语句2; 执行流程： 先对条件表达式求值判断， 如果判断结果为true，则执行语句1，并返回执行结果 如果判断结果为false，则执行语句2，并返回执行结果
<script> false?alert("为true执行这一句"):alert("为false执行这一句") </script> <script> var a =500, b = 400 ,c =300; var tmp = a > b ?(a > c? a : c) :(b > c ? b:c); console.log(tmp);//500 </script>
=== 全等，
判断左右两个值是否全等，它和相等类似，只不过它不会进行自动的类型转换， 如果两个值的类型不同，则直接返回false
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-EwtKLHEU-1666188705819)(C:\Users\Administrator\AppData\Roaming\Typora\typora-user-images\1664332690574.png)]
2.7：自增和自减
变量在自身的基础上增加1
++
a++使a自增1对一个变量自增后，原变量的值立即增加
--
3. 流程控制语句
程序都是自上向下的顺序执行的， 通过流程控制语句可以改变程序执行的顺序，或者反复的执行某一段的程序。流程控制主要有三种结构，分别是顺序结构、分支结构和循环结构
4.1 条件分支语句
条件判断语句也称为if语句 语法一：
if(条件表达式){
语句...
}
执行流程：
if语句执行时，会先对条件表达式进行求值判断，
如果值为true，则执行if后的语句
如果值为false，则不执行
语法二：
if(条件表达式){
语句...
}else{
语句...
}
执行流程：
if...else语句执行时，会对条件表达式进行求值判断，
如果值为true，则执行if后的语句
如果值为false，则执行else后的语句
语法三：
if(条件表达式){
语句...
}else if(条件表达式){
语句...
}else if(条件表达式){
语句...
}else if(条件表达式){
语句...
}else{
语句...
}
执行流程
if...else if...else语句执行时，会自上至下依次对条件表达式进行求值判断，
如果判断结果为true，则执行当前if后的语句，执行完成后语句结束。
如果判断结果为false，则继续向下判断，直到找到为true的为止。
如果所有的条件表达式都是false，则执行else后的语句
1.条件分支语句 switch语句 语法:
switch(条件表达式){
case 表达式:
语句...
break;
case 表达式:
语句...
break;
case 表达式:
语句...
break;
default:
语句...
break;
}
执行流程： switch…case…语句在执行时，会依次将case后的表达式的值和switch后的表达式的值进行全等比较， 如果比较结果为false，则继续向下比较。如果比较结果为true，则从当前case处开始向下执行代码。 如果所有的case判断结果都为false，则从default处开始执行代码。
4.2 循环语句
通过循环语句可以反复执行某些语句多次 while循环 语法：
while(条件表达式){
语句...
}
复制
执行流程： while语句在执行时，会先对条件表达式进行求值判断， 如果判断结果为false，则终止循环 如果判断结果为true，则执行循环体 循环体执行完毕，继续对条件表达式进行求值判断，依此类推
do…while循环 语法:
do{
语句...
}while(条件表达式)
复制
执行流程 do…while在执行时，会先执行do后的循环体，然后在对条件表达式进行判断， 如果判断判断结果为false，则终止循环。 如果判断结果为true，则继续执行循环体，依此类推
和while的区别： while：先判断后执行 do…while: 先执行后判断 do…while可以确保循环体至少执行一次。
for循环 语法：
for(①初始化表达式 ; ②条件表达式 ; ④更新表达式){
③语句...
}
复制
执行流程： 首先执行①初始化表达式，初始化一个变量， 然后对②条件表达式进行求值判断，如果为false则终止循环 如果判断结果为true，则执行③循环体 循环体执行完毕，执行④更新表达式，对变量进行更新。 更新表达式执行完毕重复②
死循环
while(true){
}
for(;;){
}
打印九九乘法表:
<!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>Document</title> <script> //打印九九乘法表 for(var i = 1; i < 9; i++) { for (var j = 1; j <= i; j++) { document.write("<span>" + j +" * " + i + " = " + (i*j + "</span>")); } document.write("<br>"); } </script> <style> body{ width: 2000px; } span{ display: inline-block; width: 100px; } </style> </head> <body> </body> </html>打印2-1000所有的质素:
<!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>Document</title> <script> for(var i = 2; i < 1000; i++) { var flag = true; for(var index = 2; index < i; index++) { if( i % index == 0) { flag = false; } } if(flag) { document.write(i + "是一个质素" + "<br />"); } } </script> </head> <body> </body> </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>Document</title> <script> for(var flag = 100; flag <= 1000; flag++) { var sum = 0; var i = flag; while(i > 0) { var index = i % 10; sum = sum + Math.pow(index,3) ; i = parseInt(i / 10); } if(sum == flag) { document.write(flag + "为水仙花数" + "<br />"); } } </script> </head> <body> </body> </html>求1-1000的7的倍数的值和，次数
<!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>Document</title> <script> var sum = 0; var index = 0; for(var i = 1; i < 1000; i++) { if(i % 7 == 0) { sum +=i; index++; } } document.write("和为： " + sum +" 次数为" + index); </script> </head> <body> </body> </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>Document</title> <script> var sum = 0; for(var i = 0; i < 1000;i++) { if( i % 2 == 0) { sum += i; } } document.write(sum + ""); </script> </head> <body> </body> </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>Document</title> <script> //输入的数其实是字符串 var num_1 = +prompt("请输入第一个数"); var num_2 = +prompt("请输入第二个数"); var num_3 = +prompt("请输入第三个数"); var math = 0; if(num_1 < num_3) { math =num_1; num_1 = num_3; num_3 = math; } if(num_2 < num_3) { math =num_3; num_3 = num_2; num_2 = math; } if(num_1 < num_2) { math =num_1; num_1 = num_2; num_2 = math; } console.log("" + num_1+ " > "+ num_2+ " > "+ num_3); document.write("" + num_1+ " > "+ num_2+ " > "+ num_3); </script> </head> <body> </body> </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>Document</title> <script> var sum = 1000; var index = 0; while( sum < 5000) { sum *= 1.05; index++; } document.write(sum + "次数为" +index); </script> </head> <body </body> </html>
5.数组
一组任意数据类型的数据集合
和Java不同
创建：
//构造函数创建 let arr = new Array(); console.log(arr); //通过字面量创建 let arr2 = [2,3]; console.log(arr2);数组中新增元素
数组中可以通过以下方式在数组的末尾插入新元素：
数组[ 数组.length ] = 新数据;
6.函数:
功能块
创建：
具名（命名）函数
匿名函数
var fn = function(){...};作用域：
JavaScript（es6前）中的作用域有两种：
- 全局作用域
- 局部作用域（函数作用域）
Js中没有块级作用域（在ES6之前）
全局变量
在全局作用域下声明的变量叫做全局变量（在函数外部定义的变量）。
全局变量在代码的任何位置都可以使用
在全局作用域下 var 声明的变量 是全局变量
特殊情况下，在函数内不使用 var 声明的变量也是全局变量（不建议使用）
局部变量 :在局部作用域下声明的变量叫做局部变量（在函数内部定义的变量）
- 局部变量只能在该函数内部使用
- 在函数内部 var 声明的变量是局部变量
- 函数的形参实际上就是局部变量
全局变量：在任何一个地方都可以使用，只有在浏览器关闭时才会被销毁，因此比较占内存
局部变量：只在函数内部使用，当其所在的代码块被执行时，会被初始化；当代码块运行结束后，就会被 销毁，因此更节省内存空间
7.内置对象:
JavaScript 中的对象分为3种：自定义对象 、内置对象、 浏览器对象
前面两种对象是JS 基础 内容，属于 ECMAScript； 第三个浏览器对象属于 JS 独有的， JS API 讲解内
置对象就是指 JS 语言自带的一些对象，这些对象供开发者使用，并提供了一些常用的或是最基本而必要
的功能（属性和方法），内置对象最大的优点就是帮助我们快速开发
7.1:Math对象
Math 对象不是构造函数，它具有数学常数和函数的属性和方法。跟数学相关的运算（求绝对值，取 整、最大值等）可以使用 Math 中的成员.
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-5u5zLxry-1666188705820)(C:\Users\Administrator\AppData\Roaming\Typora\typora-user-images\1664334683503.png)]
8:闭包
是全局变量
- 特殊情况下，在函数内不使用 var 声明的变量也是全局变量（不建议使用）
局部变量 :在局部作用域下声明的变量叫做局部变量（在函数内部定义的变量）
- 局部变量只能在该函数内部使用
- 在函数内部 var 声明的变量是局部变量
- 函数的形参实际上就是局部变量
全局变量：在任何一个地方都可以使用，只有在浏览器关闭时才会被销毁，因此比较占内存
局部变量：只在函数内部使用，当其所在的代码块被执行时，会被初始化；当代码块运行结束后，就会被 销毁，因此更节省内存空间
7.内置对象:
JavaScript 中的对象分为3种：自定义对象 、内置对象、 浏览器对象
前面两种对象是JS 基础 内容，属于 ECMAScript； 第三个浏览器对象属于 JS 独有的， JS API 讲解内
置对象就是指 JS 语言自带的一些对象，这些对象供开发者使用，并提供了一些常用的或是最基本而必要
的功能（属性和方法），内置对象最大的优点就是帮助我们快速开发
7.1:Math对象
Math 对象不是构造函数，它具有数学常数和函数的属性和方法。跟数学相关的运算（求绝对值，取 整、最大值等）可以使用 Math 中的成员.
[外链图片转存中…(img-5u5zLxry-1666188705820)]
8:闭包
是指函数可以使用函数之外定义的变量
17万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
