目录
1.JS组成和基本结构
1.1 JavaScript缘由
- 可以实现HTML/CSS初级验证实现不了的复杂校验
- 减轻服务器压力（在发送请求到服务器之前使用js验证客户端）
- W3C标准，结构化（HTML），表现化（CSS），行为化（Javascript）
1.2 JavaScript定义
1.2.1 JavaScript定义
- 脚本语言（一堆命令组合在一起可以批量执行的称为脚本）
- 有一定的安全性
- 一种基于对象的一种语言（创建对象/面对对象）
- 可以定义一堆事件（方法/函数）并进行调用
1.2.2 JavaScript特点
（1）向HTML页面中添加交互行为
（2）脚本语言，语法和Java类似
（3）解释性语言，边执行边解释
1.2.3 JavaScript组成部分
（1）ECMAScript （核心语法，js的前身）
（2）DOM（文档对象模型）
（3）BOM（浏览器对象模型）
1.3 JavaScript基本结构
<script type="text/javascript">
alert("jojo");
</script>特点1：script标签是js脚本的标签元素名
特点2:type="text/javascript"代表告诉浏览器<script>标签内部是Js代码
特点3:alert("jojo")；代表在网页中弹出提示框，并且提示框的内容是jojo
特点4:<script>标签一般可以存放在页面然后位置
特点5:开发过程中一般存放在body最下方（HTML最下方）
1.4 JavaScript执行原理
第一步：用户端发送请求到服务器端
第二步：将js解析出来的数据（用户身份标识）绑定在请求路径中
第三步：服务器端获取到参数之后会响应客户端（返回数据到客户端）
第四步：客户端通过浏览器解析响应的数据并将数据展现在浏览器上
2.网页引入JS三种方式
2.1 使用script标签
2.2 使用外部引入
2.3 HTML标签内部引入
3.JavaScript核心语法
3.1 变量
特点1:JS变量 存储变量值，这个变量值会赋给变量名
【变量名 = 变量值】代表的含义即将变量值赋给变量名
特点2:如何使用变量步骤：
- 步骤1:定义变量名【var 变量名】
- 步骤2:变量赋值【变量名 = 变量值】
- 步骤3:输出变量【alert（变量名）】
特点3:变量的特殊写法：(因为Javascript是弱语言，即便你写的不如Java那样规范，但有时浏览器也会帮你兼容，但不建议这样写）
<script type = "text/JavaScript">
a = 123;
alert(a);
</script>3.2 数据类型
- 数值类型 number
- 字符串类型 String
- 布尔类型 boolean
- underfine类型（变量定义了但是没有赋值）
- null类型
拓展：typeof（）代表的含义是查询某个参数的类型
特点1:null == underfine代表两者等价
特点2：typeof（null）代表含义是null属于父类型objec类型
3.3 typeof运算符
typeof检测变量的返回值
typeof运算符返回值如下
- undefined：变量被声明后，但未被赋值
- string：用单引号或双引号来声明的字符串
- boolean：true或false
- number：整数或浮点数
- object：javascript中的对象、数组和null
3.4 String对象
3.4.1 常见用法
length属性
特点：获取某个字符串的长度，利用length属性（包含空格）
charAt（index）方法
特点：charAt()方法可返回指定位置的字符，第一个字符位置为0，第二个字符位置为1
indexof（）方法
特点：查找某个指定的字符串在字符串中首次出现的位置
3.4.2 String属性方法详细
| constructor | 对创建该对象的函数的引用 |
| length | 字符串的长度 |
| prototype | 允许您向对象添加属性和方法 |
| charAt() | 返回在指定位置的字符。 |
| charCodeAt() | 返回在指定的位置的字符的 Unicode 编码。 |
| concat() | 连接两个或更多字符串，并返回新的字符串。 |
| endsWith() | 判断当前字符串是否是以指定的子字符串结尾的（区分大小写）。 |
| fromCharCode() | 将 Unicode 编码转为字符。 |
| indexOf() | 返回某个指定的字符串值在字符串中首次出现的位置。 |
| includes() | 查找字符串中是否包含指定的子字符串。 |
| lastIndexOf() | 从后向前搜索字符串，并从起始位置（0）开始计算返回字符串最后出现的位置。 |
| match() | 查找找到一个或多个正则表达式的匹配。 |
| repeat() | 复制字符串指定次数，并将它们连接在一起返回。 |
| replace() | 在字符串中查找匹配的子串，并替换与正则表达式匹配的子串。 |
| replaceAll() | 在字符串中查找匹配的子串，并替换与正则表达式匹配的所有子串。 |
| search() | 查找与正则表达式相匹配的值。 |
| slice() | 提取字符串的片断，并在新的字符串中返回被提取的部分。 |
| split() | 把字符串分割为字符串数组。 |
| startsWith() | 查看字符串是否以指定的子字符串开头。 |
| substr() | 从起始索引号提取字符串中指定数目的字符。 |
| substring() | 提取字符串中两个指定的索引号之间的字符。 |
| toLowerCase() | 把字符串转换为小写。 |
| toUpperCase() | 把字符串转换为大写。 |
| trim() | 去除字符串两边的空白。 |
| toLocaleLowerCase() | 根据本地主机的语言环境把字符串转换为小写。 |
| toLocaleUpperCase() | 根据本地主机的语言环境把字符串转换为大写。 |
| valueOf() | 返回某个字符串对象的原始值。 |
| toString() | 返回一个字符串。 |
3.5 数组
3.5.1 JavaScript数组
特点1:var array=[]代表创建一个数组
特点2:array[0]=32代表给数组第一个位置上赋值，值为32
特点3:array[5]=3代表给数组第六个位置赋值，值为3
特点4:在位置0，1，2，5上赋值，唯独3、4位置上未赋值，但依然占位，所以会导致array.length获取数组长度为6
特点5:for(var i = 0;i<array.length;i++){document.write(array[i]+"</br>")代表的含义是循环遍历array数组，从数组的0位置遍历到数组的6位置（array.length）直至循环结束
<Script type="text/javascript">
//步骤1:创建数组
var array = [];
// 步骤2:给数组赋值
array[0] = 1;
array[1] = 2;
array[2] = 3;
array[5] = 12;
// 步骤3:查询数组的长度
alert(array.length);
// 步骤4:循环遍历数组,并输出数组的每一个值至浏览器上
for(var i = 0;i<array.length;i++){
document.write(array[i]+"</br>")
}
</Script>3.5.2 数组创建\赋值的第二种表现方式
//步骤1:创建数组第二张方式
var array = new Array();
// 步骤2:给数组赋值的第二种方式
array.push(1);
array.push(3);
array.push(6);
array.push(12);
// 步骤3:查询数组的长度
alert(array.length);
// 步骤4:循环遍历数组,并输出数组的每一个值至浏览器上
for(var i = 0;i<array.length;i++){
document.write(array[i]+"</br>")
}3.5.3 数组常见的属性方法
| 属性 | length | 设置或返回数组中元素的数目 |
| 方法 | join( ) | 把数组的所有元素放入一个字符串，通过一个的分隔符进行分隔 |
| sort() | 对数组排序 | |
| push() | 向数组末尾添加一个或更多 元素，并返回新的长度 |
3.6 运算符号
3.6.1 算术运算符
+：可以是数学中的加号，也可以是连接字符串的加号
var a = 1;
var b = 2;
var c = a+b; //a+b
var d = "jojo"+"oulaoula"; //字符串连接- * /:
var a = 1;
var b = 2;
var c1 = a-b;
var c2 = a*b;
var c3 = a/b; 3.6.2 赋值运算符
= :这个符号可是是太经常用了，给变量赋值
+= ：a+=b意思是将a+b的值赋给a
var a = 1;
a+=2;3.6.3 比较运算符
| > | < | >= | <= | == | != |
| 大于 | 小于 | 大于等于 | 小于等于 | 等于 | 不等于 |
3.6.4 逻辑运算符
1. &&逻辑与
T && T ==>T
T && F ==>F
F && F ==>F
(但凡执行操作的所有参数中有一个为false结果为false）
2. ||逻辑或
T||F ==> T
T||T ==> T
F||F ==> F
(但凡执行操作的所有参数中有一个为true结果为true)
2. ！逻辑非
！F = T
! T = F
(与原有的结果相反）
如
var n = 1;
if((!(n==1))||(n!=2)){
alert("n不为1或不为2");
}else if((n>=1)&&(n<5){
alert("1<=n<5");
}3.7 逻辑控制语句
3.7.1 if条件语句
特点1:if是关键字
特点2:if之后括弧中的值为布尔值条件
特点3:如果条件为true，则执行小括号后方法体中的代码
特点4:如果条件为false，则执行else之后方法体中的代码
var n = 1;
if(n == 1){
alert("n等于1");
}else{
alert("n不等于1");
}3.7.2 switch多分支语句
特点1:switch是关键字
特点2:switch（）括号中的变量
特点3:如果变量匹配某个case的值，则执行case对应的代码体，并且通过break关键字阻止往下执行下一个case
var n = 2;
switch(n){
case 1: /*代码体*/ break;
case 2: /*代码体*/ break;
default: /*代码体*/
}拓展：if多分支和switch多分支的区别：
特点1:if多分支的条件可以是范围，也可以是等值
特点2:switch多分支的条件必须是等值
3.7.3 for、while循环语句
（a) for循环
特点1:关键字是for
特点2:初始位置从0开始，即var = 0
特点3:i < array.length的含义：结束位置是小于数组的length属性值，即末位置的角标为length-1
特点4:i++的含义：每次循环遍历的时候自增1
（b）while 循环
while语句只要指定条件为true，就会执行循环，只要指定条件为true，循环就会一直执行代码
3.7.4 for-in
在JavaScript中与for循环并无什么区别，但在Java中会有一些不同。
3.8 注释
3.8.1 单行注释
//
var a = 1 //定义一个a变量并赋值13.8.2 多行注释
/*
*/
var a/*注释*/ = 13.9 输入/输出
3.9.1 alert 弹框输出
alert("提示信息");
3.9.2 prompt 弹框输入输出
prompt("提示信息", "输入框的默认信息");
prompt("请输入你喜欢的颜色","红色");
prompt("请输入你喜欢的颜色");
可以通过prompt使用弹窗与用户交互，第一个参数是提示信息，第二个参数是文本框中的默认信息
4.函数
4.1 函数定义
- 函数定义：是完成特定任务的代码语句块
- 函数使用方式：可以直接使用
- 函数的分类：系统函数（JavaScript内置函数），自定义函数
- 自定义函数分类：匿名函数 和 有名函数
- 函数的别名：方法
4.2 常用系统函数
4.2.1 parseInt("字符串")
将字符串转换为整型数字 如: parseInt ("86")将字符串“86“转换为整型值86
var a = "121";
//2.获取变量a的类型
alert(typeof(a));
//3.利用javaScript的内置函数parseInt
//将a变量转换成数值类型的变量，并赋值给b
var b = parseInt(a);
alert(typeof(b));4.2.2 parseFloat("字符串")
将字符串转换为浮点型数字 如: parseFloat("34.45")将字符串“34.45“转换为浮点值34.45
var a = 3.12;
var b = parseInt(a);
var c = parseFloat(a);
alert(a+" "+b+" "+c);拓展：按理来说这个方法的参数应该放字符串，这里放了一个3.12的数还能运行成功吗，这里答案是可以，还是因为JavaScript是弱语言，有些错误浏览器会帮你兼容。
4.2.3 isNAN（）
用于检查其参数是否是非数字
拓展：这里注意第二个，b是一个字符串，typeof（b）结果为字符串，但isNaN（b）的结果是flase。
4.3 自定义函数
4.3.1 有名函数
（1）特点1:定义：有函数名称的函数
（2）特点2:定义函数的语法结构
function show(){
alert("jojo");
}（3）特点3:调用有名函数的语法结构
a）直接调用
function show(){
alert("jojo");
}
show();b）html调用
<input type="button" name="" id="" value="jojo" onclick="show()">4.3.2 匿名函数
- 特点1：函数无名称
- 特点2:调用匿名函数借用变量
var a = function(){
alert("jojo");
}
a();4.4 无参函数
目前为止我们都是在用无参函数
function show（）{代码体} 这个（）里什么都没有就是无参函数
4.5 有参函数
有参函数和无参函数放一起一对比就很容易知道两个分别是什么
561
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
