11-JS变量
一、 JavaScript 是什么
JavaScript是一种运行在客户端（浏览器）的脚本语言
客户端：客户端是相对于服务器而言的，在这里先简单理解为浏览器
浏览器就是一个客户端软件，浏览器从服务器上将资源（html,css,js,图片等）请求下来 并且在本地利用浏览器去解析这些资源
服务器本质上也是一台电脑。用来接收客户端发过来的请求，并处理请求。同时存储数据 读取数据等操作
脚本语言：不需要编译 读取一句 解析一句 一句报错 下一句不会继续执行
执行过程：源代码 - 预解析 - 运行
编译语言：需要编译 编译一旦出错 整个程序都不会运行
执行过程：源代码 - 编译后的字节码文件 - 运行
二、 JavaScript 历史
Nombas与ScriptEase
大概在 1992 年，一家称作 Nombas 的公司开发了一种叫做 C 减减（C-minus-minus，简称 Cmm）的嵌入式脚本语言,并将这个脚本语言捆绑在一个可以嵌入到浏览的2的共享软件中，代表了第一个在万维网上使用的客户端语言。后来由于mm听起来比较消极，Nombas又将Cmm的名字修改为ScriptEase.虽然Nombas如今在互联网行业已经销声匿迹，但是它的理念却成为因特网的一块重要基石。
Netscape与JavaScript
当网上冲浪越来越流行时，对于开发客户端脚本的需求也逐渐增大。那时，大部分因特网用户还仅仅通过 28.8 kbit/s 的调制解调器连接到网络，即便这时网页已经不断地变得更大和更复杂。而更加加剧用户痛苦的是，仅仅为了简单的表单有效性验证，就要与服务器进行多次地往返交互。设想一下，用户填完一个表单，点击提交按钮，等待了 30 秒的处理后，看到的却是一条告诉你忘记填写一个必要的字段。
为了解决这一问题，NetScape公司的 Brendan Eich 开始为即将在1995年发行的 Netscape Navigator 2.0浏览器开发一款名为LiveScript的脚本语言，最终NetScript与Sun公司合作完成了LiveScript,并且将这种语言命名为JavaScript.
微软与JScript
在JavaScript 1.1 版本发布时，微软公司也决定进军浏览器行业。微软公司在推出的IE 3.0上搭载了一个JavaScript的克隆版，并且命名为JScript.
ECMAScript
在微软进入后，有 3 种不同的 JavaScript 版本同时存在：Netscape Navigator 3.0 中的 JavaScript、IE 中的 JScript 以及 CEnvi 中的 ScriptEase.和其他编译语言不同的是，JavaScript 并没有一个标准来统一其语法或特性，而这 3 种不同的版本恰恰突出了这个问题。
1997 年，JavaScript 1.1 作为一个草案提交给欧洲计算机制造商协会（ECMA）.ECMA指派由来自 Netscape、Sun、微软、Borland 和其他一些对脚本编程感兴趣的公司的程序员组成的第 39 技术委员会(TC39) 锤炼出了 ECMA-262，该标准定义了名为 ECMAScript 的全新脚本语言。
总结：Javascript是ECMAscript的一个实现 并且在此基础上扩展了DOM和BOM
三、 JavaScript 的组成
- ECMAscript： JavaScript的核心，描述了语言的基本语法和数据类型，ECMAScript是一套标准，定义了一种语言的标准与具体实现无关
- DOM：（document object model 文档对象模型）一套操作页面元素的API
- BOM：（browser object model 浏览器对象模型）一套操作浏览器功能的API
四、 JavaScript 的写入方式
1.行内式
<div onclick="alert('行内引入')">点我试试</div>
2. 内嵌式
<body>
<div>点我试试</div>
<script>
alert('试试就试试');
</script>
</body>
3. 外链式
<script src="./03.外链式.js"></script>
注意：当一个script标签已经作为引入标签时，里面放入任何值，都是无效的。
内嵌式和外链式js文件写在哪里都会生效，但是一般都将js文件写在body的末尾。
五、 JavaScript 的输出语句
<div onclick="alert('警示框')">弹出警示框</div>
<div onclick="prompt('输入框')">弹出输入框</div>
<div onclick="console.log('只能在控制台看到')">控制台看到</div>
<div onclick="confirm('用户选择框')">用户选择确定或取消</div>
<script>
document.write('<h1>在html页面中打印东西，可以解析html标签</h1>');
</script>
alert:弹出框，会阻断下面代码的执行
console.log：控制台输出
prompt：用户可以输入内容，点击取消返回null
confirm：点击确认返回true，点击取消返回false
document.write：可以在页面中打印元素，还可以写入html标签
六、 JavaScript 的变量
1.变量的声明和赋值
<script>
// 定义变量
var age;
// 给变量赋值
age = 23;
// 输出变量
alert(age);
// 变量初始化：定义变量时同时复制
var myName = '小艾同学';
alert(myName);
// 更新变量
var address = 'www.baidu.com';
var address = 'www.sougou.com';
// 下面的变量会层叠掉上面的变量
alert(address);
// 同时声明和输出多个变量
var age = 18, name = '小艾同学', sex = 2;
alert(age + name + sex);
</script>
1.1 变量的声明和赋值特殊情况
<script>
// 只声明，不赋值
// var age;
// console.log(age);//undefined，未定义的
// 不声明，不赋值，直接使用
// console.log(sex);//报错sex is not defined
//不声明，只赋值
address = 66;
console.log(address);
</script>
2.变量的数据类型
2.1 基本数据类型
number数据类型：所有的数字都是number类型，特殊值：NaN not a number 不是一个数字。
String数据类型：所有用引号包裹的都是字符串
boolean数据类型：false，true
undefined数据类型：未定义，未赋值
null数据类型：空
2.2 引用数据类型
object对象
array数组
function函数
2.3 区别
1.基本数据类型是指存放在栈中的简单数据段，数据大小确定，内存空间大小可以分配，它们是直接按值存放的，所以可以直接按值访问。
2.引用类型是存放在堆内存中的对象，变量其实是保存的在栈内存中的一个指针（保存的是堆内存中的引用地址），这个指针指向堆内存。
引用类型数据在栈内存中保存的实际上是对象在堆内存中的引用地址。通过这个引用地址可以快速查找到保存中堆内存中的对象
3.基本数据类型从一个变量向一个变量复制时，会在栈中创建一个新值，然后把值复制到为新变量分配的位置上，改变源数据不会影响到新的变量（互不干涉）
4.引用类型复制的是存储在栈中的指针，将指针复制到栈中为新变量分配的空间中，而这个指针副本和原指针执行存储在堆中的同一个对象，复制操作结束后，两个变量实际上将引用同一个对象；因此改变其中的一个，将影响另一个；
3.数据交换案例
<script>
var num1 = 100;
var num2 = 200;
// 使num1与num2互换值
// 建立一个临时变量，将num1复制一份赋值给temp
var temp = num1;
// 将num2复制一份赋值给num1
num1 = num2;
// 最后把temp的复制一份值赋值给num2
num2 = temp;
console.log('num1:' + num1);
console.log('num2:' + num2);
</script>
var num3 = 10;
var num4 = 20;
num3 = num3 + num4;//num3 = 10 + 20
num4 = num3 - num4;//num4 = 10 + 20 - 20 = 10
num3 = num3 - num4;//num3 = 10 + 20 - 10 = 20
console.log('num3:' + num3);
console.log('num4:' + num4);
