HTML5-JavaScript概览

JavaScript（简称JS）的设计本意是想给网页加入一些交互动效，对文档的动态处理，操作浏览器（BOM）以及和服务器之间的通信（Ajax）等。

基本概念

变量
可以先声明，在赋值，也可以直接赋值。（最好先声明）
一个合法的变量名只能包含字母、数字、$符号和下划线。

var mood;
var age;
mood="happy";
//直接赋值
name="xiaoming";
//打印
alert(mood);

数据类型
JS是弱类型语言（weakly typed language）。这意味着你可以随意更改变量的类型。
类似上面定义：

var age = "thirty three";
age = 33;

字符串由0或更多字符组成。字符包括字母、数字、标点符号以及空格。字符串必须包含在引号中。你可以使用单引号或双引号;
数字包含整形、浮点，可以是正数或负数;
布尔值是另外一个常用类型，代表是或否。可以取值：true 或 false。
数组表示同名的一组数据，每个数据都是数组的一个元素。在JS里，你只需要如下声明即可：

var apples = Array();

运算符、条件语句、循环语句
与C和C++基本相同

---

函数
从本质上来讲，函数是代码复用的一种形式。 我们把一些公共代码封装在一个函数中，然后通过函数名来调用它。这样代码显得简洁而高效。

function list(){
var apples=Array("one","two","three");
for (var count = 0 ; count < apples.length; count++ ) {
alert(apples[count]);
}
}

• 变量范围： 变量可以是全局（global）或局部（local）的，全局变量可以在脚本的任何地方引用，函数中使用var来声明变量时，该变量是一个局部变量，仅在该函数上下文中有效。 如果你不使用var，该变量被当作一个全局变量。

---

面向对象
一个对象（object）是一个自包含的数据集，数据包括两种格式：属性（properties）和方法（methods）： 属性是属于对象的一个变量，而方法是对象可以调用的函数。
如一个Person对象，包含年龄、心情等变量，可以执行的动作是行走、睡觉等：

//对象的变量
Person.mood
Person.age
//对象的函数
Person.walk()
Person.sleep()

---

BOM对象操作

BOM是browser object model的缩写，简称浏览器对象模型
BOM提供了独立于内容而与浏览器窗口进行交互的对象，主要处理浏览器窗口和框架，不过通常浏览器特定的 JavaScript 扩展都被看做 BOM 的一部分。这些扩展包括：

• 弹出新的浏览器窗口
• 移动、关闭浏览器窗口以及调整窗口大小
• 提供 Web 浏览器详细信息的定位对象
• 提供用户屏幕分辨率详细信息的屏幕对象
• 对 cookie 的支持
• IE 扩展了BOM，加入了ActiveXObject 类，可以通过 JavaScript 实例化 ActiveX 对象

JavaScript是通过访问BOM（Browser Object Model）对象来访问、控制、修改客户端(浏览器)，由于BOM的window包含了document，window对象的属性和方法是直接可以使用而且被感知的，因此可以直接使用window对象的document属性，通过document属性就可以访问、检索、修改XHTML文档内容与结构。因为document对象又是DOM（Document Object Model）模型的根节点。可以说，BOM包含了DOM(文档对象模型)，浏览器提供出来给予访问的是BOM对象，从BOM对象再访问到DOM对象，从而js可以操作浏览器以及浏览器读取到的文档。

---

DOM对象操作

DOM（Document Object Model 文档对象模型）是W3C的标准，是所有浏览器公共遵守的标准。

DOM定义了访问 HTML 和 XML 文档的标准，是HTML和XML的应用程序接口（API），它允许程序和脚本动态地访问和更新文档的内容、结构和样式。Dom技术使得用户页面可以动态地变化，如可以动态地显示或隐藏一个元素，改变它们的属性，增加一个元素等，DOM技术使得页面的交互性大大地增强。

---

CSS-DOM

使用DOM接口来操作CSS样式，与直接在CSS中定义规则相比，JS CSS-DOM可以动态或者定时改变样式，这是CSS所不能实现的。

JavaScript似乎能胜任一个网页从构造到显示、以及动态改变网页结构样式的功能。但是这并不意味着所有的事情交由JS完成是一个好的选择。 一般性的网站建设，我们通常还是会通过HTML来构造页面结构，然后通过CSS来设定样式，通过JS来改变行为，HTML/CSS/JS各司其职。 当然对于一些以交互为主的网页应用（如游戏、工具）而言，使用纯JS来构建对于组件化有帮助，而且能减少服务请求，提高性能。

---

Ajax

Ajax实际就是XMLHttpRequest对象和DOM、(X)HTML和CSS的简称，用于概括异步加载页面内容的技术。

---

原型式继承

JS的面向对象继承机制是通过原型（prototype）对象来实现的。通过继承，我们可以实现一个包含这些公共接口的基础面板对象，其他对象从他派生而来，自然继承其所有的方法，避免了重复定义和实现。