JS（JS介绍、变量、运算、数据类型）

目录
一、JavaScript基本介绍
二、JavaScript与HTML5的关系
三、如何编写运行JS
四、变量的概念及基本运算
五、变量命名规则和关键字的介绍
六、算术、赋值、关系运算符
七、数据类型的转换
八、NaN的概念和应用
九、八进制和十六进制

---

一、Javascript基本介绍

JavaScript 用来做人与浏览器之间的行为，是一种脚本语言。
静态网页就是没有行为的，动画并不是行为。行为例如表单、按钮、上传
JavaScript的组成：
	ECMAScript（标准）
		它规定了语法、类型、语句、关键字、保留子、操作符、对象。（相当于法律）
	BOM（浏览器对象模型）
		可以访问浏览器窗口的浏览器对象模型，对浏览器窗口进行操作
	DOM（文档对象类型）
		DOM把整个页面映射成一个多层节点结构。
		HTML页面组成都是某种类型的节点，这些节点又包含着不同类型的数据
JavaScript能用来做什么？
	页面分为：结构、表现、行为。JavaScript是行为部分

---

二、JavaScript与HTML5的关系

HTML5是一种新的技术，就目前而言，我们所知的HTML5都是一些标签。
但是有了js之后，这些标签的深层的拓展内容才能得以实现。
比如video标签，我们对其理解为一个简单的标签。
但实际上，video标签还有更深层次的拓展内容
html写在html文件内，css写在css文件内，js写在js文件内。
css在html文件内：<style type="text/css"></style>
JS写在html文件内:<script type="text/javascript"></script>
可以写在html文件内的任何位置  不要再js文件内 写关于css的style标签

---

三、如何编写运行JS

JS也是一种脚本语言，有两种方式在HTML页面进行引入，一种是外联，一种是内部。
外联js的写法：
<script src="" type="text/javascript" charset="utf-8"></script>
内部js的写法：
<script type="text/javascript"></script>
错误的写法：
<script src=""></script>  //不可以在外联方法内些js脚本，外联方式只能用作调用

alert（"hello world"）
向页面中打印内容，用来停止浏览器加载代码，弹出一个对话框，内容显示在对话框中。
这个功能一般用来做测试。某一段代码是否出现bug。
浏览器解析代码的顺序（从上到下，从左到右）

document.write（"hello world"）
向页面中打印内容，内容显示在页面中。

document可以直接解析标签：
document.write（"<b>加粗的内容</b>"）

转义字符：
&lt； <
&gt；>
document.write（"&lt;b&gt;加粗的内容</b>"）

---

四、变量的概念及基本运算

如何创建一个变量
	关键字  变量名="赋值"
	var tom="猫"
	var a="<b>加粗的内容</b>"
	var是一个关键字，用来声明一个变量
	=表示赋值（取名字）
声明变量以“=”为区分，左边为变量名（被赋值），右边为存放进变量中的内容

var 声明变量的底层原理：我们所写的程序运行在内存中，当我们使用关键字var声明一个变量的时候，计算机会从内存中划分一个空间，为我们存放的不同类型的内容做准备。

变量的类型（数据类型）
字符型：	string；“ ”‘  ’ （被单引号和双引号，包裹的部分，引号必须配套使用）
数字型：	number； 0-9
布尔型：	boolean：true和false（真假）
未定义型：undefined：这是一个特殊类型，当变量被声明，但是没有被赋值的时候
对象型：object  在{ }里的就是对象类型
数组型：array  在[ ]里的就是数组类型

如何区分或得知不同的数据类型；通过关键字 typeof

---

五、变量命名规则和关键字的介绍

变量的名字就像人的名字一样，不能乱起。
我们能从名字中读出很多含义，是因为我们的语言常识
同样，变量也有一套类似的常识标准，代表了各种含义，如下：
	字符型：前缀 s  类型String      浮点数：前缀 f  类型Float
	数字型：前缀 n  类型Number      函数：前缀 fn   类型Function
	布尔型：前缀 b  类型Boolean      整数：前缀 i   类型 Integer
	未定义型：前缀 u  类型Undefined    正则表达式：前缀 re  类型RegExp
	对象型：前缀 o  类型Object
	数组型：前缀 a  类型Array
前缀就能表示出这个变量的类型
开头必须为字母或者$或者_  typeof不能做为变量名
关键字和保留字不能用做变量名。

---

六、算术、赋值、关系运算符

算术运算符：+加法 -减法 *乘法 /除法 %取余
var a=10，b=3；
	a+b=13；
	a-b=7；
	a*b=30；
	a/b=3.333；
	a%b=1；
目测，跟数学中的运算符是一样的。但是：
var a=10，b="3"；
	a+b=103;
	（此处的103不是数值而是字符；"="起到了隐式转换的作用，将a从数值型转换为字符型）
	（+两边只要有一方是字符，+的功能就变成了字符串链接）
	a-b=7；a*b=30；a/b=3.333；a%b=1；
	（在（-，*，/，%）这些运算符时，"="也会起到隐式转换的作用
	将字符转换为数值，"="就是正常的运算作用）
总结： +号，有两层意思，第一层算数之间的加法；第二层字符串的连接
执行过程中，先检测加号两边的数据类型，如果发现字符型，那就先生效字符的连接

没有定义 not defined，表示没有声明这个变量；
未定义	undefined，表示声明了变量但是没有赋值。
两个含义不一样。

赋值运算符：=    +=    -+    *=    /+    %=
	+=：
	var a=10；
	a += 10；
	console.log（a）
	
	-=：
	var a=10；
	a -= 5；
	console.log（a）
	自增自减运算：++  --
		a++表示在a原有的基础上增加1；a--表示在a原有的基础上减小1；
		var a = 1；
		alret（a）；
		
		那么，++a和--a呢？和上面的道理是同样的。
		但是，区别在哪呢？看下面。
		var b = 1；
		alert（b++）；在这一步 显示出来的按道理应该是2，但是显示出来的是1；
		alert（b）；在这一步，再输出一次 b ，才会显示出来 2。
		
		var c = 1；
		alert（++c）；在这一步直接就显示出来2
		区别一目了然了。
		
		原因在：++c属于前自增；b++属于后自增；
		前自增与后自增有本质的区别，他们相同点都是为本身加了1，不同点是
		前自增是先加1，再使用操作数。
		后自增是先使用操作数，再加1.
		前自减和后自减道理同上。
关系运算符：<    <=    >     >=    ==    !=    ===
	var a=10;
	var b=20;
	console.log（a>b）//输出的结果就是false
	console.log（a<b）//输出的结果就是true
	console.log（a=b）//输出的结果就是20，因为"="是赋值的意思，所以a被赋值了。
	console.log（a == b）//现在就正常了，输出的结果是false。"=="是等于的意思。
	console.log（a != b）//输出的结果是，true。
	var a="10"
	var b=10;
	conlose.log（a == b）//输出的结果是true，因为都是10，虽然是不同类型的
	conlose.log（a === b）//输出的结果是false；
	"=="与"==="的不同点是：
	"==" 是只比较数值是否相同。
	"==="也是比较数值是否相同，但是多了一个步骤，比较是否为相同类型.

	var a="20";
	var b="19";
	conlose.log（a>b）
	//输出的结果是true，此处并没有发生类型转换，只是字符有属于它们的一套比较方式。
	var a="20";
	var b="190";
	conlose.log（a>b）
	//输出的结果是true，这里用到了 字符的逐位比较，得到结果，停止比较。 因为2>1。

	var a="a";//前面的a为变量，后面的a为赋值。
	var b="b";
	conlose.log（a>b）
	//输出的结果是false，字母的比较，用的是ASCII编码格式进行比较

逻辑运算符：||（或）  &&（与）  !（非）
	||（或）：只要有一边为真，就为真。两边都为假，才为假。
	conlose.log（true||flase）;//输出的结果是true
	&&（与）：只要有一边为假，就为假。两边都为真，才为真。
	conlose.log（true&&false）;//输出的结果是假。
	!（非）：相反。非真为假，非假为真。
	var a=10;
	var b=20;
	var c=30;
	var d=40;
	conlose.log（a<b||c>d）;//输出的结果是真
	conlose.log（a<b&&c>d）;//输出的结果是假

---

七、数据类型的转换

数值转字符：
	var a=10;
	conlose.log（a）;//输出的结果是10；
	conlose.log（typeof a）;输出的结果是 number
	conlose.log(a.toString()); 输出的结果是10；不过这次是字符
	conlose.log(typeof a.toString()); 输出的结果是string
	
字符转数值:
	var a="10";
	conlose.log(parseInt(a));//输出的结果是10，这里是数值
	conlose.log(typeof parseInt(a));//输出的结果是 number；
	
	var b="123.456"
	conlose.log(parseInt(a));//输出的结果是123，parseInt转换为整数
	conlose.log(pareFloat(a));//输出的结果是123.456，parseFloat转换为浮点型。
	
	var c="123.4a56"
	conlose.log(parseInt(c));//输出的结果是123
	  parseInt从左向右检测到第一个非数值的字符（包括"."）停止，返回前面的数字
	conlose.log(parseFloat(c));//输出的结果是123.4
	  parseFloat从左向右检测到第一个非数值的字符（不包括"."）停止，返回前面的数字
	
	var d="hello world"
	conlose.log(d);//输出的结果是hello world
	conlose.log(parseInt(d));//输出的结果是 NaN
	conlose.log(parseFloat(d));//输出的结果是 NaN
	如果要转换的字符串的第一个字符就不是数字，那么会得到NaN
	
	强制数据类型转换：
	  数字转字符：
	  num.toString();
	  字符转数字：
	  parseInt从左向右检测到第一个非数值的字符（包括"."）停止，返回前面的数字
	  parseFloat从左向右检测到第一个非数值的字符（不包括"."）停止，返回前面的数字
	  console.log( Number());强制转换为数值,转换规则更严格，字符必须完全是数字
	  
	隐式数据类型转换：算术运算符中
	
	四舍五入：Math.round
	var num="1234.56789"
	conlose.log(Math.round(num));//输出的结果是1235；
	
	保留小数：toFixed
	var num=123.456789;
	conlose.log(num.toFixed(2));//输出的结果是123.46

---

八、NaN的概念和应用

NaN 全称 not a number , 它不是一个数值，但是它占着数值型的类型。
它是 特殊的，不是一个数字的数值型， 自身budengyu自身。
conlose.log(NaN==NaN);//输出的结果是 flase； 
非法的数值运算，会得到NaN
应用：当你做一个类型转换的时候，你并不确定它是否是NaN。
	isNaN();
	is not a number；
	是不是 不是 一个数字
	conlose.log(isNaN(NaN));//输出的结果是true
	conlose.log(isNaN(123));//输出的结果是false
	conlose.log(isNaN(parseInt("123")));
	//如果输出的结果是false，那么说明parseInt转换的字符123，能成功转换为数值。
	如果输出的结果是true，那么说明parseInt转换的字符123，没有成功转换为数值。

---

九、八进制和十六进制

二进制：0-1，用二进制表示5（101）
八进制：0-7，用八进制表示10（12）
十进制：0-9，用十进制表示20（20）
十六进制：0123456789ABCDEF，用十六进制表示25（19）
conlose.log(0.1+0.6);//输出的结果是0.7
conlose.log(0.1+0.7);//输出的结果按道理是0.8，但是计算机中输出的是0.79999···
conlose.log(0.2+0.6);//输出的结果是0.8；
电脑在运算过程中以正确的二进制浮点进行运算，但是我们输入的都是十进制数，这两者并不是能转化的那么准确，有时会得到准确的结果，但有时就没这么幸运。