**静态网页的动态效果_javaScript基础 [web基础day09]

版权声明：文章为作者自己原创文章，转载请注明出处。 https://blog.csdn.net/qq_37128049/article/details/84885936

JavaScript概述：

1. 概念：一门客户端脚本语言
	* 运行在客户端浏览器中的。每一个浏览器都有JavaScript的解析引擎
	* 脚本语言：不需要编译，直接就可以被浏览器解析执行了

2. 功能：
	* 可以来增强用户和html页面的交互过程，可以来控制html元素，让页面有一些动态的效果，增强用户体验。

3. JavaScript发展史：
	* 1992年，Nombase公司，开发出第一门客户端脚本语言，专门用于表单的校验。命名为： C--  ，后来更名为ScriptEase
	* 1995年，Netscape（网景）公司，开发出了一门客户端脚本语言：LiveScript。后来，请来SUN公司的专家，修改LiveScript，命名为JavaScript
	* 1996年，微软抄袭JavaScript开发出JScript语言
	* 1997年，ECMA(欧洲计算机制造商协会)，制定出客户端脚本语言的标准：ECMAScript，就是统一了所有客户端脚本语言的编码方式。

	* JavaScript=ECMAScript+ JavaScript自己特有的东西（BOM+DOM);
	* ECMAScript：客户端脚本语言的标准

入门

1. 基本语法：  -->与html结合的方式：
	1.内部JS：
		* 定义<script>,标签内容就是js代码
	2.外部JS：
		* 定义<script>,通过src属性引入外部的js文件

2. 注意；
	* <script>可以定义在html页面的任何地方。但是定义的位置会影响执行顺序。
	* <script>可以定义多个。
	
3. 注释：
	1.单行注释： //注释内容
	2.多行注释：/*注释内容*/

4. 数据类型：
	* 原始数据类型（基本数据类型）：
		1.number：数字。 整数/小数/NaN（not a number 一个不是数字的数字类型）
		2.string：字符串。  字符串“abc”“a”'abc'
		3.boolean：true和false
		4.null
		5.underfined：未定义。如果一个变量没有给初始化值，则会被默认赋值为undefined
5. 变量
	1. 变量：一小块储存数据的内存空间
	2. Java语言是强类型语言，而JavaScript是弱类型语言
		* 强类型：在开辟变量储存空间时，定义了空间将来储存的数据的数据类型。只能储存固定类型的数据
		* 弱类型：在开辟变量储存空间时，不定义空间将来的储存数据类型，可以存放任意类型的数据。
	3. var 变量名=初始化值；
	4. typeof运算符：获取变量的类型。
	5. 注意：
		1. 字符串与number类型进行运算的时候，必须先自己先把字符串转为number，不然的话会自动的进行拼接，而不是进行运算。
		2. null运算后得到的是object

深入

1. 运算符
	1. 一元运算符：只有一个运算符的运算符
		* ++，--，+（正号）
			1. ++ ，--：自增（自减）
			2. ++（--）在前，先自增（自减），再运算
			3. ++（--）在后，先运算，再自增（自减）
	2. 算数运算符
		+ - * / % ...
	3. 赋值运算符
		= += -+...
	4. 比较运算符
		> < >= <= == ===(全等于)
		* 比较的时候，两个字符串比较是按照从首字母到后依次比较，按照ASCII表里面比较，数字亦然。
		* 两个等于是内容的比较，（如果数据类型不一致，会先转换为同样的数据类型再进行比较，字符串和数字比较优先字符串转换为数字）
		* 三个等于是全等于，它包括了数据类型也要进行比较，如果数据类型不一致，则直接返回false；
	5. 逻辑运算符
		&& || ！   
		* && 和||  都有短路的特点，即如果已经求出了结果了，那么后面的运算将不会再运算了。
			1. number：0或Nan为假，其他为真
			2. String：除了空字符串（""），其他都是true
			3. null&undefined：都是false
			4. 对象：所有对象都为true
		* if（str）{...}判断str不为null并且不是空字符串
		* if（obj）{...}判断对象是否为null
		（注：obj为对象，str为字符串类型。）
		pareInt（）：将字符串转换为数字
	6. 三元运算符
		？：表达式
		var a=3；
		var b=4；
		var c=a>b?1:0;

2. 流程控制语句：
	1. if...else...
	2. switch:
		* 在java中，switch语句可以接受的数据类型：byte int shor char，枚举（1.5），String（1.7）
		* switch（变量）
	3. case 值：
		* 在JS中，switch语句可以接受任意的原始数据类型
	3.while
	4.do ...while
	5.for
		//这里将obj作为条件判断，如果obj为字符串，则必须非空必须长度大于1，如果为对象则obj必须不为空，所以在执行语句的同时能反向对obj的类型和值进行判断了。
		if（obj）{
		alert（123）；
		}

3. JS特殊语法：
	1.语句以;结尾，如果一行只有一条语句则；可以省略（不建议）
		（如果一行有多条语句会报错，必须要写分号）；
	2.变量的定义使用var关键字，也可以不使用。
		* 用：定义的变量时局部变量
		* 不用：定义的变量是全局变量

4. 基本对象：
	1.Function的函数（方法）对象
		1. 创建：
			* var fun=new Function（形式参数列表，方法体）
			* function 方法名称（形式参数列表）{
				方法体
				}
			* var 方法名=function（形式参数列表）{
			方法体
			}
		2. 方法：
		方法名.length   表示该方法的参数数量有多少
		3. 属性：
			var 方法名=function（形式参数列表）{
			方法体
			}
		4.特点：
			1. 方法定义是，形参的类型不能写，返回值类型也不写。
			2. 方法是一个对象，如果定义名称相同的方法，会覆盖。
			3. 在JS中，方法的调用只与方法的名称有关，和参数列表无关，调用方法没有给参数的话，方法内的参数会变成未定义，不会报错。
			4. 在方法声明中有一个隐藏的内置对象（数组），arguments，封装所有的实际参数。
			5. 方法名称（实际参数列表）



5. Array：数组对象
	1. 创建：
		1. var arr=new Array（元素列表）；-->这里的元素列表可以为空
		2. var arr= new Array（默认长度）；（给一个数字）
		3. var arr=[元素列表]；
	2. 方法：	
		* join：（分隔符）将数组中的所有元素按照指定的方式拼接成一个字符串。如果arr.join()括号内如果没有给参数那么按逗号分隔，如果给了符号，则按指定的符号进行分隔。
		* push：添加元素。向数组的末尾添加一个或者更多元素，并返回一个新的数组长度。
		* toString 转换成字符串
		* 更多方法可以查看文档。
	3. 属性：
		length：数组的长度。
	
	4. 特点：
		* 在JS中，数组的长度是可变的。
		* 在JS中，数组的元素是可变的。
		* 可以存储任意类型的数据

6. Date 日期对象：
	1. 创建：
		var date=new Date（）；
	2. 方法：
		toLocalString（）：返回当前date对象对应的时间本地字符串格式。
		getTime（）：获取毫秒值。返回当前日期时间到1970年1月1日的时间毫秒值差。
	3. 举例：
		document.write(date.toLocaleString()+"<br>");

7. Math 数学类对象
	1. 创建：
		var math=new Math()；
	2. 方法：
		abs():  绝对值
		ceil（）：向上取整
		floor（）：向下取整
		random（）：返回一个随机小数（0~1之间的，包括0不包括1）；

8. RegExp对象：
	1. 正则表达式。  它是一套规则：和字符串数据进行匹配的规则。
	2. 正则表达式的规则：
		x  		这个位置只能出现字符x
		[abc]	a，b或c
		[^abc]	任何字符，除了abc（否定）
		[a-zA-Z]	a到z或A到Z，两头的字母包括在内（范围）
		. 		任意字符
		\d		[0-9]
		\D		[^0-9]
		\w		单词字符：[a-zA-Z_0-9]
		x？		x，一次或者0次
		x*		x，零次或者多次
		x+		x，一次或者多次
		x{n}		x，恰好n次
		x{n，}	x，至少n次
		x{n，m}	x，至少n次，但是不超过m次
		
	3.
		//验证qq号，开头不能为0，中间是任意的数字，5-13位
		var regex=/[1-9][0-9]{4-12}$/;
		alert(regex.text("12345"));
		//验证手机号，开头必须是1，中间是任意数字，号码是11位。
		var one=/[1][0-9]{10}$/;
		alert(one.test("15867788289"));

		注意：这里的中括号表示前面的[0-9]这个限制条件一共重复十次。
		$表示结尾标志。
		
		RegExp常用于校验，校验邮箱，qq号，手机号的规格等，以后工作中如果有遗忘可以搜其他人写的。
		
		结束$ 开始 ^  如果没有加开始和结束符号一部分内容满足正则表达式也返回true；



9. Global：
	1. 特点：全局对象，这个Global中封装的方法不需要对象就可以直接调用。
		 方法名（）;
	2. 方法：encodeURI（）：url编码（类似于加密，它将不能正常传输的内容转换成%+十六进制的整数。）
		decodeURI（）:url解码（解密，把%+十六进制的内容转换成正常的字符）
		encodeURIComponent（）：url编码（编码的字符更多一点，将一些不是中文的内容也编码了。）
		decodeURIComponent（）:url解码
		注意：这个方法是为了解决URL上无法传输中文的问题。
	3. URL编码 
		如果用的UTF-8编码，则get中的编码是每个汉字3个字节，GBK则是两个
	4. parseInt（）：将字符串转为数字：
		* 逐一判断每一个字符是否是数字，直到不是数字为止，将前面数字部分转为number。 举例: a1235b=NaN     123dfhasdg=123
			isNaN（）：判断一个值是否是NaN
			NaN六亲不认，连自己都不认。NaN参与的==比较全部为false,所以想判断一个数是否是NaN就只能用isNaN方法；
	5. eval（）： 执行一段JS内容，它的内容是以字符串体现的。