JavaScript概述

1.1、JavaScript可以做什么

1.1.1、页面的各种动画效果(比如轮播图)-自动

1.1.2、页面的点击/移入响应-用户操作

1.1.3、对客户端数据进行验证

1.1.4、各种页面小游戏

1.1.5、用途总结

嵌入动态文本于HTML页面。
对浏览器事件做出响应(对于用户的操作给予响应)。
读写HTML元素。
在数据被提交到服务器之前验证数据(客户端数据校验)。
检测访客的浏览器信息。
控制cookies，包括创建和修改等。
基于Node.js技术进行服务器端编程。

1.2、Why JavaScript

类似于JavaScript的语言有很多,比如: 微软推出的JScript，CEnvi推出的 ScriptEase

所有主流浏览器都支持JavaScript(支持程度广)。
目前，全世界大部分网页都使用JavaScript(用户群体广)。
它可以让网页呈现各种动态效果，做为一个Web开发师，如果你想提供漂亮的网页、令用户满意的上网体验，JavaScript是必不可少的工具(特点)。
易学性，学习环境无外不在，只要有文本编辑器，就能编写JavaScript程序。它是基于Java简化设计而来。

1.3、JavaScript基础概述

JavaScript是一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。

JavaScript主要用于HTML的页面，嵌入在HTML的源码中。

JavaScript是因特网上最流行的脚本语言，它存在于全世界所有 Web 浏览器中，能够给页面添加动态效果和动态交互。(JavaScript想要运行,需要基于浏览器,不需要服务器)。

JS是弱类型语言,没有类型声明,它的变量不必具有一个明确的类型。

JS是脚本语言，换句话说，可以用来编程的并且直接执行源代码的语言,就是脚本语言。

JS也是解释性的语言。何为解释性语言?是在运行的时候将程序直接翻译成机器的语言。

JavaScript是一种**基于对象(Object)和事件驱动(Event Driven)**并具有安全性能的脚本语言,可广泛用于PC、笔记本电脑、平板电脑和智能手机等设备。

HTML5的出现更是突出了JavaScript的重要性，例如HTML5的绘图支持、本地存储、离线应用、客户端通信等，都大量使用了JavaScript。

在1995年时，由Netscape(网景)公司的Brendan Eich(布兰登·艾奇)，在网景导航者浏览器上首次设计实现而成。

因为Netscape与Sun合作，Netscape管理层希望它外观看起来像Java，因此取名为JavaScript。但实际上它的语法风格与Self及Scheme较为接近。

为了取得技术优势，微软推出了JScript，CEnvi推出ScriptEase，与JavaScript同样可在浏览器上运行。为了统一规格，因为JavaScript兼容于ECMA标准，因此也称为ECMAScript。

ECMA这个组织的目标是评估，开发和认可电信和计算机标准。

1.4、JavaScript组成部分

JavaScript是ECMAScript、文档对象模型（document object model:DOM）、浏览器对象模型（brower object model:BOM）由三部分构成。

ECMAScript，描述了该语言的语法和基本对象(内置对象)。

文档对象模型（DOM），描述处理网页内容的方法和接口。通过 DOM，可以访问所有的 HTML 元素，连同它们所包含的文本和属性，可以对其中的内容进行修改和删除，同时也可以创建新的元素；

浏览器对象模型（BOM），描述与浏览器进行交互的方法和接口。BOM提供了独立于内容而与浏览器窗口进行交互的对象，例如可以移动，调整浏览器大小的window对象，可以用于导航的location对象与history对象，可以获取浏览器，操作系统与用户屏幕信息的navigator与screen对象。

1.5、JavaScript特点

JavaScript是一种属于网络的脚本语言,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果。通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的(但写成单独的js文件有利于结构和行为的分离)。

脚本语言。JavaScript是一种解释型的脚本语言,C、C++等语言先编译后执行,而JavaScript是在程序的运行过程中逐行进行解释。

基于对象。JavaScript是一种基于对象的脚本语言,它不仅可以创建对象,也能使用现有的对象(内置对象)。

简单性。JavaScript语言中采用的是弱类型的变量类型,对使用的数据类型未做出严格的要求,是基于Java基本语句和控制的脚本语言,其设计简单紧凑。

动态性。JavaScript是一种采用事件驱动的脚本语言,它不需要经过Web服务器就可以对用户的输入做出响应。在访问一个网页时,鼠标在网页中进行鼠标点击或上下移、窗口移动等操作JavaScript都可直接对这些事件给出相应的响应（针对于用户在页面中的操作,都是基于事件驱动）。

跨平台性：JavaScript脚本语言不依赖于操作系统,仅需要浏览器的支持。因此一个JavaScript脚本在编写后可以带到任意机器上使用,前提上机器上的浏览器支持JavaScript脚本语言,目前JavaScript已被大多数的浏览器所支持。

不同于服务器端脚本语言，例如PHP与ASP，JavaScript主要被作为客户端脚本语言在用户的浏览器上运行，不需要服务器的支持。所以在早期程序员比较青睐于JavaScript以减少对服务器的负担，而与此同时也带来另一个问题：安全性。

而随着服务器的强壮，虽然程序员更喜欢运行于服务端的脚本以保证安全，但JavaScript仍然以其跨平台、容易上手等优势大行其道。同时，有些特殊功能（如AJAX）必须依赖Javascript在客户端进行支持。随着引擎如V8和框架如Node.js的发展，及其事件驱动及异步IO等特性，JavaScript逐渐被用来编写服务器端程序。

Javascript脚本语言同其他语言一样，有它自身的基本数据类型，表达式和算术运算符及程序的基本程序框架。Javascript提供了四种基本的数据类型和两种特殊数据类型用来处理数据和文字。而变量提供存放信息的地方，表达式则可以完成较复杂的信息处理。

1.6、JavaScript历史

1995年，它最初由Netscape(网景)的Brendan Eich设计。JavaScript是甲骨文公司的注册商标。Ecma国际以JavaScript为基础制定了ECMAScript标准。JavaScript也可以用于其他场合，如服务器端编程。完整的JavaScript实现包含三个部分：ECMAScript，文档对象模型，浏览器对象模型。

Netscape在最初将其脚本语言命名为LiveScript，后来Netscape在与Sun合作之后将其改名为JavaScript。JavaScript最初受Java启发而开始设计的，目的之一就是“看上去像Java”，因此语法上有类似之处，一些名称和命名规范也借自Java。但JavaScript的主要设计原则源自Self和Scheme。JavaScript与Java名称上的近似，是当时Netscape为了营销考虑与Sun微系统达成协议的结果。为了取得技术优势，微软推出了JScript来迎战JavaScript的脚本语言。为了互用性，Ecma国际（前身为欧洲计算机制造商协会）创建了ECMA-262标准（ECMAScript）。两者都属于ECMAScript的实现。尽管JavaScript作为给非程序人员的脚本语言，而非作为给程序人员的脚本语言来推广和宣传，但是JavaScript具有非常丰富的特性。

发展初期，JavaScript的标准并未确定，同期有Netscape的JavaScript，微软的JScript和CEnvi的ScriptEase三足鼎立。1997年，在ECMA（欧洲计算机制造商协会）的协调下，由Netscape、Sun、微软、Borland组成的工作组确定统一标准：ECMA-262。

1.7、JavaScript的引入方式

引入JavaScript需要使用script标签：

<script>标签用于定义客户端脚本,script 元素即可包含脚本语句，又可通过 src 属性指向外部脚本文件。

如果想在页面上使用JavaScript，必须使用<script>标签,把JavaScript源码放入<script>和</script>之间。

标签属性:
type：指定脚本的类型。

src：指定外部脚本的url。

1.7.1、行内引入JavaScript

在标签事件属性中填写JavaScript代码或调用函数时，不是事件=函数名，而是事件=函数名+()

<button οnclick="alert('我是一个警告框')" type="button">点击这里</button>

<script>function myfunction(){document.getElementById("demo").innerHTML="onclick事件触发";}</script>
</head>
<body><h1 id="demo">一个段落</h1><button οnclick="myfunction()" type="button">点击这里</button>
</body>

1.7.2、内部引入JavaScript

您可以在 HTML 文档中放入不限数量的脚本。

脚本可位于 HTML 的<body>或 <head>部分中，或者同时存在于两个部分中。

通常的做法是把函数放入<head>部分中，或者放在页面底部。这样就可以把它们安置到同一处位置，不会干扰页面的内容。

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction()
{document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";
}
</script>
</head>
<body>
<h1>我的 Web 页面</h1>
<p id="demo">一个段落</p>
<button type="button" onclick="myFunction()">尝试一下</button>
</body>
</html>

<!DOCTYPE html>
<html>
<body>
<h1>我的 Web 页面</h1>
<p id="demo">一个段落</p>
<button type="button" onclick="myFunction()">尝试一下</button>
<script>
function myFunction()
{document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";
}
</script>
</body>
</html>

1.7.3、外部引入JavaScript

也可以把脚本保存到外部文件中。外部文件通常包含被多个网页使用的代码。

外部 JavaScript 文件的文件扩展名是 .js。

如需使用外部文件，请在 <script>标签的 “src” 属性中设置该 .js 文件：

<!DOCTYPE html>
<html>
<body>
<script src="myScript.js"></script>
</body>
</html>

如果把JS源代码直接写在某个具体的页面上时(通常放在<head>标签下)，这样的成为内部的JavaScript。但是当JS 代码越来越庞大的时候，我们最好把它独立另存为一个JS文件，扩展名为.js,然后在页面上引入即可，这样的称为外部的JS文件，它具有维护性高、可缓存(加载一次，无需加载)、方便未来扩展、复用性高等特点。

1.8、Hello JavaScript

第一种方式：弹出对话框,内容为Hello,JavaScript.

第二种方式：页面文档上输出Hello,JavaScript

1.9、JavaScript注释及注意事项

单行注释:

// 单行注释内容
多行注释:

/* 多行注释内容 */
文档注释

/** 文档注释内容 */

注意事项：
1.字母的大小写，Name和name是两个不同的标识符。

2.空格和换行。这一点和CSS代码规则类似:多余的空格会被忽略，可以将一行代码分成多行写。

3.分号作为一个语句的结束标志，分号之后是新语句的开始。虽然省略不写通常也是没有问题的，但还是建议大家写上。