JavaScript基础概述
1 定义
JavaScript是一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。
它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。
2 历史
在1995年时,由Netscape公司的Brendan Eich,在网景导航者浏览器上首次设计实现而成。因为Netscape与Sun合作,Netscape管理层希望它外观看起来像Java,因此取名为JavaScript。但实际上它的语法风格与Self及Scheme较为接近。
为了取得技术优势,微软推出了JScript,CEnvi推出ScriptEase,与JavaScript同样可在浏览器上运行。为了统一规格,因为JavaScript兼容于ECMA标准,因此也称为ECMAScript。
3 相关术语:
ECMA:欧洲计算机制造商协会(Standard ECMA-262European Computer Manufacturers Association)。
TC39:ECMA第39号技术委员会(Technical Committee#39),由来自一些关注脚本语言发展的公司的程序员组成,负责制定一种通用、跨平台、供应商中立的脚本语言。
ECMAScript:由ECMA制定,在ECMA-262中定义的脚本语言标准。ECMAScript只是一个脚本语言标准,你尽可以在自己的环境中取实现它,这个环境,就称为ECMAScript的宿主环境,Web浏览器可以说是ECMAScript目前最重要的宿主环境了,而不同的Web浏览器,对ECMAScript标准的支持也不尽相同。除Web浏览器,Adobe ActionScript也实现了ECMAScript。一般的宿主环境,除了实现ECMAScript标准,也会有各自的扩展,以便与环境更好的交互。
ES3、ES5:ECMAScript目前最新的版本是5.1版,发布于2011年7月,可以从其官方网站免费下载。最主要的两个版本是第3版和第5版,分别简称为ES3和ES5,目前五大浏览器(IE、Firefox、Chrome、Safari、Opera)都已经开始不同程度的支持ES5了,但目前在Web浏览器上兼容性最好的还是第3版。介于向后兼容和安全上的考虑,第5版提供了普通和严格两种模式,后面会再讨论相关内容。
LiveScript、JavaScript、JScript:LiveScript是Netscape最初开发JavaScript时的名称,在发布时,为了赶上Java的时髦,临时修改为JavaScript了,而JScript则是微软为了防止版权冲突而给自己的脚本语言起的名称。对于开发者来说,他们都只是ECMAScript的实现。一般来说,JavaScript的除了实现ECMAScript外,还会包括针对浏览器的扩展(BOM:浏览器对象模型)和针对XML/HTML API的扩展(DOM:文档对象模型)。
DOM:文档对象模型(Document Object Model),DOM标准由负责制定WEB通信标准的W3C(World Web Consortium,万维网联盟)制定。DOM并非针对JavaScript的,很多别的语言也都实现了DOM。目前DOM共有三级标准(DOM1、DOM2、DOM3),有时,也将DOM标准之前称为DOM0级,现代浏览器几乎全部支持DOM2级标准,也部分支持DOM3级标准了。
BOM:浏览器对象模型(Browser Object Model)。
4 组成部分:
(1) ECMAScript,描述了该语言的语法和基本对象。
(2) 文档对象模型(DOM),描述处理网页内容的方法和接口。
(3) 浏览器对象模型(BOM),描述与浏览器进行交互的方法和接口。
5 基本特点
JavaScript是一种属于网络的脚本语言,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果。通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的。
(1) 是一种解释性脚本语言(代码不进行预编译)。 [4]
(2) 主要用来向HTML(标准通用标记语言下的一个应用)页面添加交互行为。 [4]
(3) 可以直接嵌入HTML页面,但写成单独的js文件有利于结构和行为的分离。 [4]
(4) 跨平台特性,在绝大多数浏览器的支持下,可以在多种平台下运行(如Windows、Linux、Mac、Android、iOS等)。
Javascript脚本语言同其他语言一样,有它自身的基本数据类型,表达式和算术运算符及程序的基本程序框架。Javascript提供了四种基本的数据类型和两种特殊数据类型用来处理数据和文字。而变量提供存放信息的地方,表达式则可以完成较复杂的信息处理。
6 应用用途
(1) 嵌入动态文本于HTML页面。
(2) 对浏览器事件做出响应。
(3) 读写HTML元素。
(4) 在数据被提交到服务器之前验证数据。
(5) 检测访客的浏览器信息。
(6) 控制cookies,包括创建和修改等。
(7) 基于Node.js技术进行服务器端编程。
7 特性
JavaScript脚本语言具有以下特点:
(1) 脚本语言。JavaScript是一种解释型的脚本语言,C、C++等语言先编译后执行,而JavaScript是在程序的运行过程中逐行进行解释。
(2) 基于对象。JavaScript是一种基于对象的脚本语言,它不仅可以创建对象,也能使用现有的对象。
(3) 简单。JavaScript语言中采用的是弱类型的变量类型,对使用的数据类型未做出严格的要求,是基于Java基本语句和控制的脚本语言,其设计简单紧凑。
(4) 动态性。JavaScript是一种采用事件驱动的脚本语言,它不需要经过Web服务器就可以对用户的输入做出响应。在访问一个网页时,鼠标在网页中进行鼠标点击或上下移、窗口移动等操作JavaScript都可直接对这些事件给出相应的响应。
(5) 跨平台性。JavaScript脚本语言不依赖于操作系统,仅需要浏览器的支持。因此一个JavaScript脚本在编写后可以带到任意机器上使用,前提上机器上的浏览器支 持JavaScript脚本语言,目前JavaScript已被大多数的浏览器所支持。 [3]
不同于服务器端脚本语言,例如PHP与ASP,JavaScript主要被作为客户端脚本语言在用户的浏览器上运行,不需要服务器的支持。所以在早期程序员比较青睐于JavaScript以减少对服务器的负担,而与此同时也带来另一个问题:安全性。
而随着服务器的强壮,虽然程序员更喜欢运行于服务端的脚本以保证安全,但JavaScript仍然以其跨平台、容易上手等优势大行其道。同时,有些特殊功能(如AJAX)必须依赖Javascript在客户端进行支持。随着引擎如V8和框架如Node.js的发展,及其事件驱动及异步IO等特性,JavaScript逐渐被用来编写服务器端程序。
8 功能
(1) 控制Html文档的外观和内容。
JavaScript可以很轻松地动态改变网页的CSS样式和结构,甚至页面显示内容。这使整个页面灵活性大大增加,可以使用户动态决定页面的外观和内容。
例:
<!DOCTYPE html> <html> <body> <h2>JavaScript 能做什么</h2> <p id="demo">JavaScript 能够改变 HTML 内容。</p> <button type="button" onclick='document.getElementById("demo").innerHTML = "Hello JavaScript!"'>点击我!</button> </body> </html>
例:
<!DOCTYPE html> <html> <body> <h2>JavaScript 能够做什么</h2> <p id="demo">JavaScript 能够改变 HTML 元素的样式。</p> <button type="button" onclick="document.getElementById('demo').style.fontSize='35px'"> 点击我! </button> </body> </html>
例:
<!DOCTYPE html> <html> <body> <h2>JavaScript 能够做什么</h2> <p id="demo">JavaScript 能够隐藏 HTML 元素。</p> <button type="button" onclick="document.getElementById('demo').style.display='none'"> 点击我! </button> </body> </html>
例:
<!DOCTYPE html> <html> <body> <h2>JavaScript 能够做什么</h2> <p>JavaScript 能够显示隐藏的 HTML 元素。</p> <p id="demo" style="display:none">Hello JavaScript!</p> <button type="button" onclick="document.getElementById('demo').style.display='block'"> 点击我! </button> </body> </html>
(2) 控制浏览器的行为。
例如:浏览器的退后,刷新,加入收藏夹等操作。
(3) 用户交互操作
如网上问卷等。
(4) 与页面各种元素交互。
如操作图片,与Flash动画通信等。
例:
<!DOCTYPE html> <html> <body> <h2>JavaScript 能做什么?</h2> <p>JavaScript 能够改变 HTML 属性值。</p> <p>在本例中,JavaScript 改变了图像的 src 属性值。</p> <button onclick="document.getElementById('myImage').src='/i/eg_bulbon.gif'">开灯</button> <img id="myImage" border="0" src="/i/eg_bulboff.gif" style="text-align:center;"> <button onclick="document.getElementById('myImage').src='/i/eg_bulboff.gif'">关灯</button> </body> </html>
(5) 读写部分客户端信息。
如读写浏览者电脑的cookie信息。
9 局限性
JavaScript程序和C++,C#,Java等程序对比而言,有很大的局限性。
(1) JavaScript是一种脚本程序,即通过解释运行,没有编译,效率较低。
(2) JavaScript代码暴露在网页源代码中。
(3) JavaScript只能嵌于网页中使用,不能读写客户端的程序(cookie除外)