JavaScript 简介

问题导向清单

问题导向清单
问题解决放啊
定义文档内嵌脚本程序?使用 script 元素。
立即执行一条程序语句?将语句直接放在 script 元素内。
定义 JavaScript 函数?使用 function 关键字。
定义基本类型的变量?使用 var 关键字,并以 字面量 表示其值。
创建对象?使用 new Object() 或 对象字面量 语法。
给对象添加方法?新建一个属性,然后将一个函数赋给它。
获取或设置对象的属性值?使用圆点或数组索引符号表示法。
枚举对象中的属性?使用 for...in 语句。

JavaScript 是 Web 页面中的一种脚本编程语言,也是一种通用的、跨平台的、基于对象和事件驱动并具有安全性的脚本语言。它不需要进行编译,而是直接嵌入到 HTML 页面中,把 静态页面 转变成支持 用户交互 并 响应相应事件 的动态页面。

JavaScript 的起源

LiveScript的创造者是Brendan Eich,首次在NetScape 2中实现。它的目的是创建一门足够简单的语言让开发者能容易地为网页增加交互,只要把代码拷贝过来调整一下就可以。很多LiveScript开发者是从拷贝粘贴开始的。

在Netscape发展LiveScript的同时,Sun公司也正在发展Java语言,为了辅助Java的网页程式方面的设计,这两家公司进行合作,共同发展LiveScript语言,并将LiveScript语言改名为JavaScript。

JavaScript 语言最初命名为 LiveScript,由美国 Netscape(网景)公司的布瑞登·艾克(Brendan Eich)为 1995 年发布的 Navigator 2.0 浏览器而开发的脚本语言。Netscape 与 Sun(升阳)公司(现已被甲骨文公司收购)合作之后,就在 Navigator 2.0 正式发布前,Netscape 公司将其改名为 JavaScript,也就是最初的 JavaScript 1.0 版本。虽然当时的 JavaScript 1.0 版本还有很多缺陷,但拥有 JavaScript 1.0 版本的 Navigator 2.0 浏览器几乎主宰了浏览器市场。

JavaScript 最初受 Java 启发而开始设计的,目的之一就是看上去像 Java,因此语法上有类似之处,一些名称和命名规范也借鉴 Java。但 JavaScript 的主要设计原则来自 Self 和 Scheme。JavaScript 与 Java 名称上的近似,是当时 Netscape 为了营销考虑与 Sun(Java 的创造者) 达成协议的结果。

因为 JavaScript 1.0 如此成功,Netscape 公司在 Navigator 3.0 中发布了 JavaScript 1.1 版本。同时微软开始进军浏览器市场。

为了取得技术优势,微软推出 JScript 脚本语言来迎战 JavaScript。微软发布了 Internet Explorer 3.0 并搭载了一个类似 JavaScript 的脚本,命名为 JScript。

在微软进入浏览器市场后,共有 3 种不同的 JavaScript 版本同时存在:

  • Navigator 的 JavaScript
  • IE 的 JScript
  • CEnvi 的 ScriptEase

三足鼎立,没有一个标准来统一该脚本语言的语法或特性。

1997年,JavaScript 1.1 版本作为一个草案提交给欧洲计算机制造商协会(ECMA)。最终由来自 Netscape、Sun、微软、Borland(宝蓝) 和其他一些对脚本编程感兴趣的公司的程序员组成了 TC39 委员会,该委员会被委派来标准化一个通用、跨平台、中立于厂商的脚本语言的语法和语义。TC39 委员会制定了 ECMAScript 程序语言的规范书(ECMA-262 标准),该标准通过国际标准化组织(ISO)采纳通过,作为各种浏览器生产开发所使用的脚本程序的统一标准。

什么是 JavaScript

JavaScript 是一种基于 对象 和 事件驱动 并具有安全性能的解释型脚本语言,不但可用于编写客户端的脚本程序,由 Web 浏览器解释执行,还可以编写在服务器端执行的脚本程序,在服务器端处理用户提交的信息并动态地向客户端浏览器返回处理结果。

  • HTML: 描述网页内容和结构。
  • CSS: 描述网页样式。
  • JavaScript: 描述网页行为。

JavaScript 是面向 Web 的编程语言。所有的现代 Web 浏览器,基于桌面系统、游戏机、平板电脑和智能手机的浏览器,不论是客户端还是 Web 集成环境(类似 webview),都包含了 JavaScript 解释器。

JavaScript 是一门高端的、动态的、弱类型的编程语言,非常适合面向对象和函数式的编程风格。

可以通过在 .html 文件中写一个 <script> 标签来嵌入 JavaScript 代码。当浏览器加载 .html 文件时,它会自动执行这段代码。

一些浏览器实现了一个简单的控制台 API。可以通过使用函数 console.log() 函数来向控制台 Console 输出消息。

JavaScript 的主要特点

JavaScript 脚本语言的主要特点如下:

  • 解释性:

    JavaScript 不同于一些 编译性 的程序语言,例如 C、C++ 等,JavaScript 是一种 解释性 的程序语言,其源代码不需要经过编译,而是直接在浏览器中运行时被解释。

  • 基于对象:

    JavaScript 是一种基于 对象 的语言,这意味着它能运用自己已经创建的对象。因此,许多功能可以来自于脚本环境中对象的方法与脚本的相互作用。

  • 事件驱动:

    JavaScript 可以直接对用户或客户输入做出响应,无须经过 Web 服务程序。它对用户的响应,是以事件驱动的方式进行的。所谓事件驱动,就是指在页面中执行了某种操作所产生的动作,此动作称为“事件”。例如,按下鼠标、移动窗口、选择菜单等都可以视为事件。当事件发生后,可能会引起相应的事件响应。

  • 跨平台:

    JavaScript 依赖于浏览器本身,与操作环境无关,只要能运行浏览器的计算机,并支持 JavaScript 的浏览器就可以正确执行。

  • 安全性:

    JavaScript 是一种安全性语言,不允许访问本地硬盘,不能将数据存入服务器上,不允许对网络文档进行修改和删除,只能通过浏览器实现信息浏览或动态交互。这样可有效防止数据丢失。

JavaScript 的应用

使用 JavaScript 脚本实现动态页面:

  • 验证用户输入:

    使用 JavaScript 脚本语言可以在客户端对用户输入的数据进行验证。

  • 动画效果:

    在浏览网页时,使用 JavaScript 脚本语言可以实现一些动画效果,使页面更加生动。

  • 窗口的应用:

    在打开网页时经常会看到一些浮动的广告窗口,这些广告窗口是网站最大的盈利手段,可以通过 JavaScript 脚本语言来实现。

  • 各种特效,jQuery 效果,Ajax 技术。

JavaScript 在 HTML 中的使用

通常情况下,在 Web 页面中使用 JavaScript 有以下 3 种方法:

  • 在页面中直接嵌入 JavaScript 代码。
  • 使用 <script type="text/javascript" src="js/demo.js"></script> 链接外部 JavaScript 文件。
  • 作为特定标签的属性值作用。

在页面中直接嵌入 JavaScript

						
<script type="text/javascript">
  document.write("Hello Word!");
</script>
						
					
script 元素属性
属性说明
language"JavaScript1.8"设置所使用的脚本语言及版本。
src"js/demo.js"设置一个外部脚本文件的路径位置。
type"text/javascript"设置所使用的脚本语言,此属性已代替 language 属性。
defer此属性表示当 HTML 文档加载完毕后再执行脚本语言。

说明:

  • 当脚本语言不需要立即执行时,设置 defer 属性后,浏览器将不必等待脚本语言装载。这样页面加载会更快。但当有一些脚本需要在页面加载过程中或加载完毕后立即执行时,就不需要使用 defer 属性。

链接外部 JavaScript 文件

可以采用链接外部 JavaScript 文件的形式在 Web 页面中引入 JavaScript。

如果 JavaScript 代码比较复杂或是同一段代码需要被多个页面使用,那么可以将这些 JavaScript 代码放在一个单独的 .js 文件中,然后在有需要的 Web 页面中链接该 JavaScript 文件即可。

						
<script type="text/javascript" src="javascript.js"></script>
						
					

说明:

  • 如果外部 .js 文件保存在本地服务器中,src 属性有绝对路径和相对路径可选;如果外部 .js 文件保存在其他服务器中,src 属性需要指定绝对路径。
  • 在外部 .js 文件中,不能将脚本代码用 <script> 和 </script> 标记括起来。
  • 在使用 src 属性引入外部 .js 文件时,<script></script> 标记中不能包含其他 JavaScript 代码。
  • 在 <script> 标记中使用 src 属性引入外部 .js 文件时,</script> 结束标记不能省略。

作为特定标签的属性值使用

通过 "javascript:" 调用

在 HTML 中,可以通过 "javascript:" 的属性值方式来调用 JavaScript 的函数或方法。

						
<a href="javascript:alert('点击了超链接')">点我</a>
						
					

说明:

  • 通过使用 "javascript:" 属性值前缀来调用 alert() 方法,但该方法并不是在浏览器解析到 "javascript:" 时就立即执行,而是在点击该超链接时才会执行。

与事件结合调用

JavaScript 支持很多事件,事件可以影响用户的操作。例如,用户点击鼠标、按下键盘等。

与事件结合,可以调用执行 JavaScript 的方法或函数。

						
<HTML-element some-event='script'>							
<HTML-element some-event="script">

<input type="button" value="点击按钮" onclick="alert('点击了这个按钮')">
						
					

说明:

  • HTML 元素可以添加事件属性,事件属性值为 script 代码,触发事件可以调用 JavaScript 的方法或函数。

执行顺序

JavaScript 程序按照在 HTML 文件中出现的顺序逐行执行。

如果需要在整个 HTML 文件中执行,如函数、全局变量等,最好将其放在 HTML 文件的 head 元素内容中。

JavaScript 函数体内的代码并不会被立即执行,只有当所在的函数被其他程序调用时,该代码才会被执行。