向JavaScript前进
js是JavaScript的简写。
Javascript的组成
-
核心 ECMAScript
ECMAScript，就好像是人类，上天赋予了人类声线，筋骨，和大脑。
我们用声线唱出催人泪下的歌声；依靠强健的谷歌征服大自然；开发大脑研究美食和科技。而基于ECMAScript的JavaScript和Node.js才是那个不可思议的我们自己。
- ECMAScript包括：
- 语法：怎样让 ABCD变成优美的代码旋律
- 类型：男左女右
- 语句：告诉浏览器我要做什么
- 关键字：工具。
- 保留字：有所为有所不为
- 操作符：算术。
- 对象：万物皆对象。
- ECMAScript的版本
- 第一版：玩具车
- 第二版：遥控车
- 第三版：成功上路
- 第四版：内部出现分歧，一派想做跑车，一派想做轿车，两派吵得不可开交，最终两败俱伤只能放弃。第四版流产！
- 第五版：轿车上路！
- 第六版：跑车上路！
- 往后的其他版本只是让
js的档次更高。
- ECMAScript包括：
-
文档对象模型 DOM
JavaScript在暗中操纵HTML的灵魂，HTML实际上成为了JavaScript的傀儡。
-
浏览器对象模型 BOM
操纵浏览器。
让JavaScript有个家
JavaScript可以写在HTML页面里边(内联)，也可以写在HTML的之外(外联)。写内联样式的时候，JS代码必须被script标签包裹。
-
内联写法
.......
-
外联写法
在html页面之外创建一个后缀名为
js的文件，单独写javascript代码，在js文件里，JavaScript代码不用被包裹在script标签里，然后通过script标签引入进html文档里。-
浏览器如何解析：
浏览器在解析代码时碰到外部引入的js时，会先下载(等待老师发试卷)、解析(阅读题目)、执行(做题)，等执行完成之后才开始呈现页面中的内容(文字，视频，音频)。
*传统做法 ：将所有外部
js文件写在html的head标签里..... 传统毕竟是古老的东西，在现代web网页里引入的
js文件非常之多，例如：.....这无疑会导致浏览器在呈现页面时出现明显的延迟，在延迟期间用户看到的将是一片空白！
-
为了追上时代的步伐，我们应该把所有
script标签放在body元素里页面内容后边或者body标签的后边：或者:
好的，现在我们已经知道了
js的家在哪里了，接下来我们一起去跟他聊聊天：
-
变量
学习任何语言(除了原生css)，我们要接触的第一个概念一定是变量。
在javascript里有一个非常重要的内容叫做内存。如果我们把javascript看做是一个人，那么内存就是他的脑容量，脑容量比较难以理解，那么我们就把脑容量看做是一个储物柜，储物柜我们大家都见过吧，我们可以在里边放衣服，鞋子，餐具，食材等等等等的东西，但是肯定没有人把鞋子藏在自己的脑子里。那js的储物柜里放的是什么呢？答案是:数据。
我们在js的内存里划分出一个抽屉里边存储上数据，那么为了下次找的时候方便，我们最好把这个抽屉的名字写成小纸条贴在上边。抽屉使我们现实中的叫法，在js里它被称之为变量。接下来我们看到“ 变量” 就可以联想为"抽屉"，它的作用就是存放数据。
在js中这个变量(抽屉)需要我们自己创造，这个创造的过程叫做声明：
//浏览器读到var就明白了我们将要创造一个变量，这个变量叫box,‘=’等号是赋值(即在里边存放什么数据)，他里边放着1
var box = 1
//我们声明了一个变量box，使用console.log()可以在控制台打印出这个变量的值
console.log(box)//1
上边这种情况是我们直接声明了一个变量，这个变量里储存的数据是：1。同时我们也可以只声明变量等到需要存储数据的时候再把数据放进去：
/*
声明一个变量，变量名叫做something(中文意思是某个东西)，但是没有储存任何的数据，注意js是严格区分大小写的，也就是说something和someThing不是同一个变量
*/
var something
//当我们需要在这个叫做something的变量里存储数据的时候，使用等号：赋值
something = 2 //现在我们在something里存储了2，第一次在某个变量里存储数据称之为初始化
那么变量最重要的是变，何为变呢？
//这里的变表示的是变量(抽屉)里存的数据是可以变化的，刚才我们在变量message里存储了2，现在我想在里边存储3
//上边我们已经声明过something这个变量，只要声明过了下次使用的时候就可以直接用。
something = 3//这里我们重新给something赋值3
console.log(something)//3，这次我们打印出来的数据为3，原来的2被当做垃圾回收了。
上边我们在为变量赋值的时候给的都是具体的值，除此之外我们还可以把变量赋值给变量。
//我们定义了一个变量poem（诗），里边放了很多文字
var poem = "半卷湘帘半掩门，碾冰为土玉为盆。偷来梨蕊三分白，借得梅花一缕魂。"
//现在我需要一个新变量，并且里边的文字和变量poem的值一样，我可以这样做(copy -> 复制)
var copy = poem
console.log(copy)//"半卷湘帘半掩门，碾冰为土玉为盆。偷来梨蕊三分白，借得梅花一缕魂。"
上边我们声明了两个变量，为第一个变量赋值了一段文字，也就是说叫做poem的这个抽屉里放的数据是一段文字，接下来我们又创建了一个变量copy给他赋值poem，在变量copy里也存储了这句诗。过后，即便我们修改了copy里的值依然不会影响poem里的数据
copy = 123
console.log(copy)//123
console.log(poem)//"半卷湘帘半掩门，碾冰为土玉为盆。偷来梨蕊三分白，借得梅花一缕魂。"
然而在js的世界里，在很多重要场合里，这种结果是不成立的。这就怪了，到底是什么重要的场合呢？要理清这个问题我们需要先了解js中的数据类型 。
这里有一个变量的小知识：
取名规范
- 不要用中文起名（虽然可以）。
- 以字母、下划线(_)、美元符号($)开头
- 驼峰命名：第一个字母小写，后边每个单词的开头大写-> loveYou,loveMe.(√)；lovemE,loveyoU(×，因为按照规范应该第二个英文单词的首字母大写)。
综上所述：起一个程序员能看懂的英文名。一些不能取的名字列在这篇文档的最后。
数据类型
js中有5种简单的数据类型：
Undefined：未定义、Boolean：布尔值、String字符串、Number：数值、Null一种复杂的数据类型：
Object：对象判断数据类型：
typeof：判断变量是哪种数据
简单数据类型
Number
number数值：就是我们通常所说的数字。
//声明一个变量。在里边存储123
var num_one = 123
console.log(num)//123
上边我们声明了一个变量num给它赋值(在里边存储)了123，123大家都知道他是一个整数，除了整数之外还有小数(比如：1.1,100.1)。然而小数在编程里还有另外一个名字 --> 浮点数，在js里浮点数必须有小数点:
var num_two = 1.1//1.1是一个浮点数
var num_three = 1.0//1.0和1是相等的，但是1.0是一个浮点数，因为他包含了一个小数点
这里有的同学可能坐不住了，1.0和1是相等的，那区分他是一个浮点数还是一个整数不是很扯淡吗？
其实非也，由于保存浮点数值需要的内存空间时保存整数的两倍，所以不要这么做。
而对于那些非常大的数字我们该怎么写呢？
var num_four = 100000000//1亿，万一少输入一个0或者多输入一个0，两个数字的差距非常的大
//所以为了简便我们可以这样写：
var num_five = 1e8//1乘以10的8次方
//31250000就可以写成
var num_six = 3.125e7
//也可以用e表示极小的数 0.000000003
var num_seven = 3e-8
//负数的表示方法
var num_twelve = -100000000//负1亿
//可以写成
var num_twelve = 1e-8//这里要不负号放在后边
//所以-0.000000003应该写成
var num_thirteen = 3e-8
但其实上边我们列举的数字都是10进制数字，是我们日常生活中的使用的。除此之外整数还可以使用八进制、十六进制表示：
//8进制的数以0（零）开头,后边的数字不管有多少位每一位都大于等于0小于等于7(0~7)
var num_eight = 070//十进制中的56
//16进制的数以0x(零和小写x)开头，后边的数字不管有多少位每一位都是(0~9及A~F),A~F可以写成a~f
var num_nine = 0xA//10
由于JavaScript的内存有限，所以你并不能在js里保存世界上所有的数值。js能够表示的最小数值为5e-324（5乘以10的负324次方），最大值为1.7976931348623157e308（1.7976931348623157乘以10的308次方）。如果某个数字大于了最大值那么就被转换成了 Infinity（正无穷），如果某个数字的值小于了最小值，就会被转换成-Infinity（负无穷）。
正无穷和负无穷都是没法参与运算的。
如何判断一个数字是否超出了最大值或者最小值呢？使用isFinite()：
//Finite -> 有限的
let num_ten = 5
isFinite(num_ten)//true 表示没有超出
let num_eleven = 2e308
isFinite(num_eleven)//false 表示超出
除此之外，还有一类特别的数字NaN：NaN表示这不是一个数字。(具体的知识运算符章节讲)
String
String：字符串 --> 在两个双引号或者单引号之间放入任意字符就是一个字符串。
//下边这些都是字符串
var str_one = '123'
var str_two = "1大帅比"
var str_three = 'abc123大帅比'
var some_str = ''//空字符串
var new_str = ""//空字符串
//双引号和单引号要保持同步
var str_four = "小仙女'//语法错误,双引号和单引号必须保持一致
var str_five = 小仙女//报错：小仙女未被定义。因为小仙女没有被双引号或者单引号包裹起来，浏览器认为这是一个变量
Boolean
Boolean布尔值：Boolean类型有两个值 -> true真&false假。(& -> 和)
老师：同学你真的是一个大帅比吗？
同学：是的(true)。
老师：同学你有女朋友吗？
同学：没有(false)。
//因为true和false都是js自带的数据类型，所以可以
var one = true
console.log(one)//true
var two = false
console.log(two)//false
这里要特别注意一下，true和false都是小写，大写的True和False并不是布尔值。
var three = True//报错：浏览器认为True是一个变量，而我们从来没有声明过True这个变量
var four = Flase//报错
Undefined
Undefined未被定义:undefined类型只有一个值，即特殊的undefined。当我们声明了一个变量，但是没有赋值的时候(也就是说我们创造了一个抽屉，但是抽屉里什么都没有放的时候)，这个变量的值就是undefined。(undefined在英文中的意思就是未被定义的)。例如：
var message ;
console.log(message)//打印出来的值为undefined
var message = undefined//声明了一个变量，把值初始化为undefined
console.log(message)//undefined，不过没有这个必要，因为未经初始化(没有赋值)的变量默认就是undefined
console.log(typeof message)//undefined
复杂数据类型
Object
Object：对象 -->Array[数组]，普通对象Object，function[函数]
Array
数组的写法是一个中括号 ：[]
//数组里边可以存储任意类型的数据(简单数据类型和所有复杂数据类型)，每个值之间用逗号隔开，可以写无数个值。更详细的知识在以后的学习中讲。
var arr = [1,2,'3', [4,5,6]]
console.log(arr)//[1,2,'3']
//那么我们如何去访问数组里的每个值呢？console.log()可以同时打印多个值，每个值之间用逗号隔开
console.log(arr[0],arr[1],arr[2])//1 2 '3'
每个值之间用逗号隔开[]中括号里的数字表示的是第几项，js中称之为下标，与生活中从1开始计数不同，数组是从0开始计数的，在上例中1是数组arr里第0项，他的下标是0，因此我们需要使用arr[0]获得。
普通对象
对象的写法是一个大括号(或者叫做花括号) ：{}，对象和数组一样可以存储任意类型的值。
var obj = {
name: '小明',//字符串
age: 18，//数字
property: '大帅比'
}
对象和数组一样，可以存储任何类型的值，不过在写法上有差异，对象在存储数据之前要给这个数据取一个名字这个名字叫做属性名，目的是用来获取对象里存储的值。这种写法叫做键值对。我们在写属性名时最好给他取一个让别人一看就知道里边存储的是什么信息的名字。
我们可以通过属性名访问到里边的每一项，使用.或者['属性名']
console.log(obj.name, obj.age, obj.property)//"小明" 18 '大帅比'
//or
console.log(obj['name'], obj['age'], obj['property'])//"小明" 18 '大帅比'
Function
函数，function除了函数之外还有一个更贴切的中文意思叫做"功能"。
就好比我们都会说话，说话是我们的一项能力。这里我们只要知道函数的写法，以及函数可以帮助我们实现想要的功能就可以了。
//函数有很多种声明方式，这里我们暂且记住这种最常用的方式就可以，更多关于函数的知识以后再进行学习。
//这是最常用的声明函数的方式： 以function开头+空格+函数的名字+()+空格{}
function merchantli(){
//我们可以在这里边写任何的代码
}
//重新定义一个函数，名字为foo
function foo() {
console.log(1)//函数里有一段代码，可以在控制台里打印出1
}
//foo这个函数的功能是控制台打印1，但是它并不能主动打印，需要加()调用
foo()//在控制台里看到1
由此我们看出，函数是具有某种功能的东西，他的功能需要我们手动的调用，就像我们需要张口才能说话一样。其实，console.log()也是一个函数，他之所以看上去很奇怪因为他是console这个对象上的一个属性，先通过console.log找到这个属性，发现它是一个函数，然后加括号调用。之前我们已经了解到对象里可以存储任意类型的值，函数也可以储存在对象里。
console.log(1)把1写在括号里，这种方式叫做传参，括号里的内容叫做参数.
Null
Null类型也是只有一个值的数据类型，这个特殊值是null。null值表示一个空对象指针(没有对象的野指针):
var value = null
console.log(typeof value)//object
如果定义的变量准备在将来用于保存对象，那么最好将该变量初始化为null。这样一来，只要直接检查null值就可以知道相应的变量是否已经保存了一个对象的引用。
事实上，undefined值是派生自null值的，因此下边的操作放回true：
//一个等号是赋值，两个等号是判断是否相等。
console.log(null == undefined)//true
总结：
-
js在存储对象的时候存储的是对象的地址。 -
js在存储简单数据类型的时候存储的是具体的值。
不可取的变量名
以下这些英文都是js中的关键字或者保留字。
关键字指的是在js中有特殊用途的英文，比如var是用来声明变量放入。
保留字指的是在未来的某些版本里将会有特殊用途的英文。
| 饭 | 可以 | 乱吃 | 名字 | 不能 | 乱取 |
|---|---|---|---|---|---|
| break | do | instanceof | typeof | case | else |
| var | catch | finally | return | void | continue |
| for | switch | while | debugger | function | this |
| with | default | if | throw | delete | in |
| try | abstract | enum | int | short | boolean |
| export | interface | static | byte | extends | long |
| super | char | final | native | super | synchronized |
| class | float | package | throws | const | goto |
| private | transient | implements | protected | volatile | double |
| import | public | yield |
常用的函数
js里有一些常用的函数(功能)，这些函数是js已经帮我们写好的，直接使用就可以了。
alert('hello world')//警告框，在括号里写上字符串，这段文字最终在浏览器的弹窗里显示了出来。
confirm('123')//确认消息框
prompt('提示信息')//提示消息框
像这种别人写好的，我们可以直接拿来用的函数有一个响亮的名字叫做API(Application Program Interface->应用程序编程接口)，俗称“接口”或"方法"。
//console.log()是一个函数，他的功能是在浏览器的控制台打印，同时我们可以成他为console.log接口，或者console.log方法，平时方法叫的比较多。
console.log(1)//在控制台打印1