JavaScrip基础

JavaScrip基础&BOM

1.JavaScrip简介

		(1)JavaScript是一种解释性脚本语言（代码不进行预编译），由浏览器解释执行，用来向页面添加交互行为；
		(2)Java Script由三个主要组成部分：ECMAScript（核心），BOM（浏览器对象模型），DOM（文档对象模型）；
			ECMAScript描述了语法、类型、语句、关键字、保留字、运算符和对象。它就是定义了脚本语言的所有属性、方法和对象，DOM把整个页面规划成由节点层构成的文档，它不与浏览器、平台、语言相关，为web开发者提供一个标准可以访问站点中的数据、脚本和表现层对象。BOM是浏览器的一种特性，它可以对浏览器窗口进行访问和操作，例如移动、关闭窗口，调整窗口的大小，支持cookie等。
		(3)构建网站的三大技术
			①HTML：支撑网页的骨架
			②CSS：层叠样式打扮一下
			③JS：js动态脚本
![在这里插入图片描述](https://img-blog.csdnimg.cn/20200731223945875.png)

2.JavaScrip三种写法

		JavaScrip是弱类型、强语法（与Java不同）

(1)行内JS

			1.行内JS使用几率较少，只有针对某些标签的特殊操作：
				语法：<a href="javascript:alert('点你就点你');">点我，点我...</a>
			2.上述代码中，我们将JS代码写在href属性中，这样我们在点击链接的时候，执行的就不是跳转地址，而是其中的JS代码；
			3.javascript:这是伪协议的意思，类似咱们http:，伪协议是为了告诉浏览器接下来的代码是JS代码，当然部分地方可以省略，但建议写上伪协议；
			4.alert(参数值)是用来弹出一个提示框，弹框中的提示信息即为传入的参数值，弹框是JS的重要调试手段之一；
			5.console.debug()也是JS的一种调试手段，但此种调试手段在IE上不支持；
			6.使用场景:非常简单的Js代码

(2)内部JS

			1.页面内的JS是写在一组<script>标签内，这组标签可以写在页面内的任意位置：
				语法：

<script type="text/javascript">
									JS代码
								</script>
								示例代码：
							<script type="text/javascript">
								alert(“不点我也来”);
								</script>

			2.使用场景:仅仅被当前页面共享的js代码

(3)外部JS

1.外部JS方式，其实就是先单独定义一个JS文件，然后将这个JS文件与要使用的网页将关系关联起来；
引入外部JS文件：

2.引入CSS文件使用标签，引入JS文件而是使用

<!--写法1不推荐的原因,2.它会修改你当前url地址3.它会跳转到当前页面的最顶部-->
<a href="#" onclick="alert(1);">写法1</a>	
<!--href="javascript:void(0);":我当前a标签不再超链接到一个新的界面，而是作为JS触发源而存在;
javascript伪协议-->
<a href="javascript:void(0);" onclick="alert(2);">写法2</a>
<a href="javascript:;" onclick="alert(3);">写法3</a>

3.JavaScrip变量

1.使用var关键字，无论是何种数据类型的变量，均可以使用var关键字来进行声明；弱类型
2.变量官方概念？系统为之设置一个标识，程序可以用变量名来指向具体的对象内存，并通过变量名来获得对应的对象；

var 变量名;                        //声明变量【推荐方式】
var 变量名=值;                     //声明变量并赋值【推荐方式】
已声明赋值的变量 = 另一种类型值;   //【不推荐】
不声明变量 = 值;                   //不事先声明变量直接使用

1.如果按照Java的语法去声明JS变量，那么大家一定会使用推荐的两种方式去做；
2.事实上，JS的语法校验规则并不严密，在JS的语法中允许给已声明且赋值的变量赋值另外类型的值；

var name=”字符串类型”;
console.debug(name);            //在控制台输出打印name变量
name = 19;
console.dubug(name);

1.上述代码中，我们声明了一个name变量，并赋值了一个字符串，但随后我们给name变量赋值了一个数字类型；
讨论：这样的操作在Java语法中会报错吗？
2.答案是毋庸置疑的，Java语法一定会报错，但在JS的语法中，此种操作不会；
3.JS中还可以不使用var关键字，直接写一个符合命名规范的名字作为变量使用，例如：

age = 18;
console.debug(age);

4.上述操作中，我们直接使用了一个名字并赋值，JS中是允许此类操作的，但不推荐使用；
5.综上所述，我们可以得出一个结论：JS的语法规则并不如Java那么严格，所以在学习JS的过程中，请按照Java的语法风格要求自己；

4.JavaScrip原始数据类型

1.JavaScript中的原始数据类型相当于Java的基本数据类型，在js中可以使用typeof 和typeof()判断当前变量属于那种数据类型；
例子：var a = true; alert(typeof a);//boolean alert(typeof(a));//true

(1)number（数值类型）

1.JS数字类型可以采用10进制\8进制\16进制以及科学计算法等形式表示；

①　常用十进制

0x8a     //十六进制以0x或0X开头
0123     //八进制必须以0开头
1        //十进制首位不能为0
5E7      //科学计数法

②　无穷数

1.在JS语法中，数字是有取值边界的，超出最大数取值为Infinity【正无穷】，超出最小数取值为-Infinity【负无穷】，无穷数不能用于数值运算，一般使用isFinite()函数对一个数字进行判断是否是有穷的【有限的】，若传入的数据是无穷数，那么返回false，若传入的数据是有穷数，则返回为true；

isFinite(1/0);                        //Infinity
console.debug(isFinite(1/0));      //false

2.在JS中，1/0并不会报错，因为JS语法中0是取值了一个无限趋近于0的一个数字

③　非数

1.非数：不是数字，在JS中采用NAN来表示，同样在JS中采用了isNaN()函数来判定当前字符是否真的不是数字；

var n1=123;
var n2=’aaa’;
console.debug(n1/n2);             //NaN
console.debug(isNaN(n1/n2));    //true

2.NaN这个特殊字符比较有意思的地方在于：
(1)与任何值均不相等，包括自己本身；
(2)任何涉及NaN的操作都会返回NaN；

(2)boolean（布尔类型）

1.布尔类型和Java一样，采用true和false表示；
2.注释：在JS语法中，0、NaN、Undefined、空字符串、null均可以表示为false；

(3)string（字符串类型）

1.JS语法中不存在char类型，所以由单引号或双引号括起来的字符序列，任何字符串的长度都可以通过访问length属性获得；

(4)null（空对象）

1.表示一个不存在的对象，只有一个值null；

(5)undefined（未定义或未初始化）

1.表示声明但未赋值的对象，Undefined派生自null；
2.如果我们做 *、/如果有字符串，它会尝试去转换成number来进行运算，如果转换失败（NaN）；

5.JavaScrip运算符

1.在JS中同样存在算术运算符、等性运算符、逻辑运算符的操作，这些运算符的操作和JAVA一样，接下来我们演示与JAVA不一样的地方；

(1)赋值运算符

注：赋值运算符的使用和Java一样；

(2)算术运算符

注释：在JS中+运算符中有字符串的应用，会演变为字符串的拼接；

var x=3 + “3”;
console.debug(x);  //33

(3)比较运算符（关系运算符）

1.比较运算符用于判断两个变量大小关系：>、<、、<=、>=、=、!=、!=，其中：
(1) ：代表相等(它只比较内容，不比较类型)
(2)=：绝对相等(先比较类型，再比较内容)
(3)!：绝对不等

var x=10;
var y=”10”;
console.debug(x