初识JavaScript
一、JavaScript简介
JavaScript是一种轻量级的脚本语言，可以部署在多种环境，最常见的部署环境就是浏览器。所谓“脚本语言”，指的是它不具备开发操作系统的能力，而是只用来编写控制其他大型应用程序的操作方法。通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的。JavaScript具有：（1）学习环境无处不在 （2）简单性 （3）与主流语言的相似性等特点。
1.JavaScript的发展史
- 1995年12月4日 Netscape公司与Sun公司联合发布了JavaScript语言。
- 1996年03月 Navigator 2.0浏览器正式内置了JavaScript脚本语言。
- 1997年07月 ECMAScript 1.0发布。
- 1998年06月 ECMAScript 2.0版发布。
- 1999年12月 ECMAScript 3.0版发布，成为JavaScript的通行标准，得到认可。
- 2007年10月 ECMAScript 4.0版草案发布。
- 2009年12月 ECMAScript 5.0版正式发布。
- 2015年06月 ECMA19:59:27Script 6正式发布。
2.JavaScript核心部分：
1、ECMAScript：JavaScript的核心，描述了语言的基本语法(var、for、if、array等)和数据类型(数字、字符串、布尔、函数、对象(obj、[]、{}、null)、未定义)，ECMAScript是一套标准，定义了一种语言（比如JS）是什么样子。
2、文档对象模型（DOM）：DOM（文档对象模型）是 HTML 和 XML 的应用程序接口（API）。DOM 将把整个页面规划成由节点层级构成的文档。HTML 或 XML 页面的每个部分都是一个节点的衍生物。请考虑下面的 HTML 页面：
<html>
<head>
<title>Sample Page</title>
</head>
<body>
<p>hello world!</p>
</body>
</html>
这段代码可以用 DOM 绘制成一个节点层次图：
DOM 通过创建树来表示文档，从而使开发者对文档的内容和结构具有空前的控制力。用 DOM API 可以轻松地删除、添加和替换节点（getElementById、childNodes、appendChild、 innerHTML）。
3、浏览器对象模型（BOM）对浏览器窗口进行访问和操作。例如弹出新的浏览器窗口，移动、改变和关闭浏览器窗口，提供详细的网络浏览器信息（navigator object），详细的页面信息（location object），详细的用户屏幕分辨率的信息（screen object），对cookies的支持等等。BOM作为JavaScript的一部分并没有相关标准的支持，每一个浏览器都有自己的实现，虽然有一些非事实的标准，但还是给开发者带来一定的麻烦。
3.JavaScript使用领域：
JavaScript使用领域比较广泛，大致总结如下：（1）浏览器的平台化（2）Node.js（3）数据库操作（4）跨移动平台
4.JavaScript调试工具：
Javascript的调试工具也是极其简单。只要安装了Chrome浏览器， 那么在其自带的“开发者工具中“唤醒”控制台” ，就能够随时运行和调试javascript代码。
控制台(console)：代码运行和调试的一个工具，因为开发者可以在这个工具中对整个代码的运行过程进行调控，故形象的被成为控制台。
控制台唤醒：
Mac环境下：Option+Command+J
Windows/Linux环境下：Ctrl+Shift+J
ps:在检查代码的界面中按下esc也能唤醒控制台，只不过这个时候页面样式也存在，会对js的调试产生影响。
二、JavaScript名词解释
1.script标签表示脚本，可以在script标签中编写js代码。另外，通过script的src属性可以引入外部的脚本文件，就好比link标签一样。注意:script标签可以写在html文件的任意位置，但是一般写在body的最后。
2.语句：描述：以分号结尾的表达式称为语句。注意：一般情况下一行就是一个语句【多个语句可以写在一行，但不推荐】例子：var num1=10;
3.变量：描述：其保存的值可以发生改变的量，称为变量。语法：变量一般采用var命令声明：var num;
注意：
（1）var num; 称为变量的声明
（2）num = 10; 称为变量的赋值【变量在使用之前必须先声明】
（3）var num = 10; 称为变量的初始化
补充:（仅作为参考）
创建变量的过程实际就是向系统申请内存的过程
变量赋值的过程，实际上就是内存中放入具体值的过程
console.log(变量名); // 命令能够将变量的值输出到控制台当中【ctrl+shift+j win系统快捷打开控制台】
例子：
var myAge;
myAge = 19;
console.log(myAge); // 将变量myAge 所保存的值，输出到控制台中
myAge = 20;
console.log(myAge);
三、JavaScript变量命名规则
1.变量的名对大小写敏感
例子：
var num = 10;
var NUM = 20;
console.log(num);
console.log(NUM);
2.变量名以字母或美元符或者下划线开头，并由字母、数字、下划线、美元符任意组合而成【不能以数字开头且不能包含特殊符号】
例子:
var $$$;
var $ $;
var $(abc);
3.不能使用js系统关键字命名变量【不能使用name！！！】
4.变量名一般采用驼峰命名法【首个单词首位小写，其余单词首位大写】
例子：
var schoolStuInfo;
四、JavaScript变量类型
1.基本数据类型:描述：JS中有6种数据类型，包含5种数据类型和1种（object）对象类型 类型： （1）number 数字类型 （2）string 字符（串）类型 （3）boolean 布尔类型 （4）undefined 未定义类型 （5）null 空类型 注意：JS中拥有动态类型，变量可以根据【保存的值的类型】不同，而表现为不同类型。 【typeof 运算符能够查看变量的类型】 例子： var item; //将item赋值为16，并查看此时item的变量类型 item = 16; console.log(typeof item); //将item的值更改为true并再次查看item的变量类型 item = true; console.log(typeof item); 2.数字类型number:描述：JS中数字类型可以使用小数点、不使用小数点或伪科学计数法表示 例子： var num1 = 3; var num2 = 3.14; var num3 = 314e3; // 314e3=314E3 console.log(314e3); // 结果为314000
3.字符（串）类型string:描述：在JS中字符串类型是用来存储字符的类型，可以使用单或双引号定义。 注意：字符串在定义的时候，只要写在引号内部即可，但唯一不能写在内部的就是【外部定义时使用的引号】 例子： var str1 = ‘‘; // 空字符串，不是没有类型！！！ var str2 = ‘a‘; var str3 = ‘hello world!‘; var str4 = "goodbye world!"; var str5 = "my name is ‘frank‘!"; var str6 = ‘my name is "frank"!‘; var str6 = "my name is "frank"!"; // 错误写法！！！ 4.布尔类型boolean:描述：可以用来判断真假的数据类型 类型：true(真),false(假) 例子： var flag = true; var flag2 = false; console.log(flag); console.log(flag2); 5.未定义类型undefined:描述：用来描述当变量的值不确定的时候，变量所表示的类型 未定义类型中只有一个值：undefined 例子： var num; console.log(typeof num); // 输出结果为undefined 6.空类型 null:描述：表示对象为空
五、JavaScript运算符简介
1.运算符概述： （1）typeof：描述：用来获取当前变量的类型 语法：typeof 变量名 注意：尽管看起来不像，但是typeof是一个运算符 例子： var item = 18; console.log(typeof item); var item = ‘love‘; console.log(typeof item);
（2）赋值运算符【=】：描述：在JS中，=号代表的含义是，将等号右面的值赋值给等号左面的变量。 注意：=号在JS中绝对不等于数学中的含义 强调：使用赋值运算时，变量应写在左面！！！ 例子： var item; //15 = item; // 错误写法 item = 15; （3）判断是否相等运算符【==】 【===】 描述： ==【简要比较运算符】表示判断两个变量的值是否相等(忽略变量的类型)，相等返回true ===【标准比较运算符】表示判断两个变量的值是否相同(包括变量的类型),相等返回true 例子： var item1 = 10; var item2 = ‘10‘; console.log(item1==item2); // true console.log(item1===item2); // false （4）注释 a:单行注释：//，写在要加注释代码的末尾处 b:多行注释：/ *...* /(/* */)，写在要加注释代码的开头位置 c：文档注释：/ ** ...* /,一般写在代码块的前面
2.算术运算符 类型：+(加法) -(减法) *(乘法) /(除法) %(取余) 功能： (1)基本功能 var num1 = 3; var num2 = 4; var sum = num1+num2; var cha = num1-num2; var ji = num1*num2; var shang = num1/num2; var quyu = num1%num2; console.log(sum); console.log(cha); console.log(ji); console.log(shang); console.log(quyu); (2)特殊功能 +:(隐式转换) a.如果加号两端有一端不是数字，那么先将数字转换成字符串，然后将两个字符串拼接。 b.如果多个加号同时存在，按照从左到右的计算规则计算 剩下的所有算术运算符：(隐式转换) a.如果符号两端有一端不是数字，那么先将不是数字的内容转换成数字，然后在进行计算 b.如果不是数字的内容无法转换成数字，则结果是NAN（not a number） 例子： var num1 = 10; var num2 = ‘abc‘; var result = num1-num2; console.log(result); console.log(typeof result); 3.三目运算符 ?: 描述：判断表达式的结果，从而根据结果执行不同的语句。 语法：表达式1?表达式2:表达式3 解释： 首先计算表达式1的布尔值，如果是true，那么整个算式的结果是表达式2 如果是false，那么整个算式的结果是表达式3 例子： var num1 = 10; var num2 = 100; var result = (num1==num2)?‘num1等于num2‘:‘num1不等于num2‘; console.log(result); 4.JS中对于布尔值的一些隐式规则 true代表真-------非0即为真 false代表假-----0为假
5.运算符的补充
1、算术运算符 描述：++(自增运算符)、--(自减运算符) 语法：++num、num++、--num、num-- 功能：对变量本身进行加1或减1 例子： var num = 10; num++; // 相当于num = num+1； console.log(num); num--; // 相当于num = num-1； console.log(num); 注意： (1)对于自增自减运算符，如果出现在运算子的前面，则先将自己自增或自减，然后再执行当前语句。 (2)对于自增自减运算符，如果出现在运算子的后面，则先执行当前语句，执行完毕再自己自增自减。 例子： var num =10; console.log(++num); // 先计算本身，再参与语句执行 console.log(num++); // 先参与语句执行，再计算本身 console.log(num); 2、赋值运算符 描述：+=、-=、*=、/=、%= 语法：num+=6; 解释：表示累加，【num+=6;】相当于【num = num+6;】 例子： var num = 10; num+=1; // num = num+1; num++; console.log(num); 3、比较运算符 描述：比较运算符能够根据规则比较两个变量的值，返回一个布尔值，用来表示是否满足规则。 类型：==、===、！==、！===、>、>=、<、<= 例子： var num1 = 15; var num2 = 30; var num3 = ‘15‘; console.log(num1==num3); 思考：数字能够比较大小，那么字符串能不能比较呢？如果能，怎么比较呢？ 【js中字符串间的比较是按照位次优先，比较各字符的ASCII码大小，包括数字字符串之间的比较。】 例子： 1.console.log("1"<"3"); // true 2.console.log(‘5‘<‘10‘); // false 3.console.log("123"<"123"); // false 4.console.log("abc"<"aad"); // false 补充： var item1 = undefined; var item2 = null; console.log(item1==item2); console.log(item1===item2); // false console.log(undefined===undefined); console.log(null===null); 4、布尔运算符 描述：&&(与)、||(或)、!(非) 语法： (1)&&与运算符：(表达式1)&&(表达式2); 运算符两端表达式结果均为true的时候，整个表达式为true，有一个为false，则整个结果为false var num1 = 15; var num2 = 30; var result = (num1>5)&&(num2<50); console.log(result); (2)||或运算符：(表达式1)||(表达式2); 运算符两端表达式任一结果为true的时候，整个表达式为true，两者皆为false，则整个结果为false var num1 = 15; var num2 = 30; var result = (num1>5)||(num2>50); console.log(result); (3)!非运算符：！(表达式) 表达式结果为true，则整个表达式结果为false； 表达式结果为false，则整个表达式结果为true； var num1 = 15; var result = ！(num1>5); console.log(result); 5、运算符优先级（截取常用部分） 初等单目一二级 //初等指的是() 乘除取余加减移 关系等于不等于 ...