python html5 bootstrap 视频教程

德云社区

 找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 4978|回复: 0

JavaScript - 支持 HTML 服务器 客户端的直译式动态脚本语言

[复制链接]

185

主题

204

帖子

1175

积分

工程师

Rank: 5Rank: 5

金钱
759
金币
15
威望
0
贡献
0
发表于 2015-9-17 05:56:50 | 显示全部楼层 |阅读模式
AI人工智能 语音助理 人工翻译 教程
JavaScript - 支持 HTML 服务器 客户端的直译式动态脚本语言

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


虽然 JavaScript 与 Java 有着紧密的联系,但却是两个公司开发的不同产品。Java 是 SUN 公司推出的新一代面向对象的程序设计语言,特别适合于 Internet 应用程序开发;而 JavaScript 是 Netscape 公司的产品,其目的是为了扩展 Netscape Navigator 功能,而开发的一种可以嵌入 Web 页面中的基于对象和事件驱动的解释性语言,JavaScript 的前身是Live Script;而 Java 的前身是 Oak 语言。


智能编辑重构 批处理式 "数字 Python IDE" 集成开发环境 (集成高效 Cython PyInstaller 批处理小程序)

http://dt.digitser.cn/zh-CN/ide/idepy/index.html


JavaScript是一种属于网络的脚本语言,已被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果。通常,JavaScript脚本是通过嵌入在HTML中来实现自身的功能的。


Javascript 被归类为直译语言,因为,主流的引擎都是每次运行时加载代码并解译。V8 是将所有代码解译后再开始运行,其他引擎则是逐行解译(SpiderMonkey 会将解译过的指令暂存,以提高性能,称为实时编译)。但由于 V8 的核心部份多数用 Javascript 撰写(而 SpiderMonkey 是用 C++);因此,在不同的测试上,两者性能互有优劣。


与其相对应的是编译语言,譬如:C 语言,以编译语言编写的程序在运行之前,必须经过编译,将代码编译为机器码,再加以运行。


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

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


JavaScript 现是甲骨文公司的注册商标。


1995年 Netscape 公司的 Brendan Eich,在网景导航者浏览器上首次设计实现而成。因为 Netscape 与 Sun 合作,Netscape 管理层希望它外观看起来像 Java,因此取名为 JavaScript。但实际上它的语法风格与 Self 及 Scheme 较为接近。


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。


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


JavaScript 的基本特点:


01、是一种解释性脚本语言(代码不用进行预编译);

02、主要用来向HTML页面添加交互行为,将动态文本嵌入于HTML页面;

03、可直接嵌入HTML页面,但写成单独的js文件有利于结构和行为的分离;

04、跨平台性,支持绝大多数浏览器,可在多平台下运行,譬如:Windows、Linux、Mac、Android、iOS 等;


05、响应浏览器事件,检测访客浏览器信息;


06、读写HTML元素;


07、在数据被提交到服务器之前验证数据;


08、控制cookies,包括创建、修改等;


09、基于Node.js技术,进行服务器端编程。


JavaScript 已被 Netscape 公司提交给 ECMA 制定为标准,称之为 ECMAScript,标准编号 ECMA-262。目前最新版为 ECMA-262 5th Edition。符合 ECMA-262 3rd Edition 标准的实现有:


01、Microsoft 公司的 JScript


02、Mozilla 的 JavaScript-C(C 语言实现),现名 SpiderMonkey


03、Mozilla 的 Rhino(Java 实现)


04、Digital Mars 公司的 DMDScript


05、Google 公司的 V8


06、WebKit


JavaScript

JavaScript


JavaScript 框架

从 JavaScript 的历史看,不同公司之间的 JavaScript 虽然大部分语法和执行方式相同,但仍存在一些差异。


前些年,JavaScript 在不同浏览器间的兼容性,一直是 web 前端开发工程师常常为之抓破头皮的问题。为了让使用不同浏览器的用户能够看到相同的页面效果,他们不得不在自己机子上装上几个浏览器,一个一个进行调试,大大延长了开发周期。特别是面对一些业务逻辑相对复杂的 B/S 架构的工程,那简直就是噩梦。


好在技术精湛的牛人们凭借着自己丰富的开发经验,将 JavaScript 在浏览器间产生的差异封装起来解决,提供给前端开发人员一个接口去调用想执行的方法。这些方法的集合也就是所谓的 JavaScript 程序集或 JavaScript 库,大部分的 JavaScript 程序集或 JavaScript 库都带有 Ajax 特性,因此也常被叫做 Ajax 框架


Ajax 框架的诞生是一次技术革命,虽并没有改变 JavaScript 的核心内容,但它对 JavaScript 重新组织的方式无疑是一次飞跃,大大缩短了软件的开发周期。


常见的 Ajax 框架有:基于原型的 Prototype、轻量级的 jQuery 等。


prototype:一个非常流行的库,使用原型链向 JavaScript 中添加了很多不错的函数。


jQuery:JavaScript 库中的新成员,提供 css 和 xpath 选择符查找元素、ajax、动画效果等。


主要特性

JavaScript 脚本语言具有以下特点:


01、脚本语言

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


02、基于对象

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


03、简单

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


04、动态性

JavaScript是一种采用事件驱动的脚本语言,它不需要经过 Web 服务器就可对用户的输入做出响应。


在访问一个网页时,譬如:在网页中进行鼠标点击或上下滑动窗口、移动窗口等操作,JavaScript 都可直接对这些事件作出相应响应。


05、跨平台性

JavaScript 脚本语言不依赖于操作系统,仅需要浏览器的支持;因此,JavaScript脚本在编写后可移植到任意机器上使用,只要浏览器支持 JavaScript 脚本语言。目前,JavaScript 已被大多数浏览器所支持。


组成

JavaScript 由三部分组成:核心 ECMAScrip 描述了该语言的语法和基本对象;DOM 描述了处理网页内容的方法和接口;BOM 描述了与浏览器进行交互的方法和接口。


JavaScript 由三部分组成

JavaScript 由三部分组成

JavaScript 三部分组成

JavaScript 组成详细细节

JavaScript 组成详细细节

JavaScript BOM 详细构成

01、核心(ECMAScript)

JavaScript的核心,描述了语言的基本语法和对象。ECMAScript经历了三个版本的更新,现在大多数网络浏览器都支持Edition3。ECMAScript主要提供语言相关的信息与标准,如语法、类型、声明、关键字、保留字、操作运算符、对象等。


ECMAScript 并不与任何具体浏览器相绑定,实际上,它也没有提到用于任何用户输入输出的方法(这点与 C 这类语言不同,它需要依赖外部的库来完成这类任务)。那么什么才是 ECMAScript 呢?ECMA-262 标准(第 2 段)的描述如下:


  1. “ECMAScript 可以为不同种类的宿主环境提供核心的脚本编程能力,因此核心的脚本语言是与任何特定的宿主环境分开进行规定的... ...”
复制代码

Web 浏览器对于 ECMAScript 来说是一个宿主环境,但它并不是唯一的宿主环境。事实上,还有不计其数的其他各种环境(譬如:Nombas 的 ScriptEase,以及 Macromedia 同时用在 Flash 和 Director MX 中的 ActionScript)可以容纳 ECMAScript 实现。


ECMAScript 仅仅是一个描述,定义了脚本语言的所有属性、方法和对象。其他语言可以实现 ECMAScript 来作为功能的基准,JavaScript 就是这样:


ECMAScript

ECMAScript


每个浏览器都有它自己的 ECMAScript 接口的实现,然后这个实现又被扩展,包含了 DOM 和 BOM。当然,还有其他实现并扩展了 ECMAScript 的语言,譬如:Windows 脚本宿主(Windows Scripting Host, WSH)、Macromedia 在 Flash 和 Director MX 中的 ActionScript,以及 Nombas ScriptEase。


#
版本
说明
实现
01ECMA v1标准化了JavaScript1.1的基本特性,并添加了一些新特性。没有标准化switch语句和正则表达式。由Netscape 4.5和IE 4实现。
02ECMA v2ECMA v1的维护版本,只添加了说明由Netscape 4.5和IE 4实现。
03ECMA v3标准化了switch语句、异常处理和正则表达式。由Mozilla、Netscape 6和IE 5.5实现。

02、文档对象模型(DOM)

The Document Object Model,描述了作用于网页内容的方法和接口。


DOM是HTML的一个应用程序接口,它也经历了三个版本的更新,其中以第一和第二个版本使用最为广泛,在第二个版本中,最重要的特性莫过于提供了事件响应接口、处理CSS的接口、移动窗口接口、能控制代码树的结构等。


除使用最多的DOM Core和DOM HTML标准接口外,其他部分语言也拥有自己的DOM标准,如SVG、MathML、SMIL。


DOM 将把整个页面规划成由节点层级构成的文档。HTML 或 XML 页面的每个部分都是一个节点的衍生物。请考虑下面的 HTML 页面:


  1. <html>
  2.       <head>
  3.             <title>Sample Page</title>
  4.       </head>
  5.       <body>
  6.             <p>hello world!</p>
  7.       </body>
  8. </html>
复制代码

这段代码用 DOM 绘制成节点层次图,如下所示:

HTML DOM节点层次图

HTML DOM节点层次图

DOM 通过创建树来表示文档,从而使开发者对文档的内容和结构具有空前的控制力。用 DOM API 可以轻松地删除、添加和替换节点。


03、浏览器对象模型(BOM)

The Browser Object Model,描述了和浏览器交互的方法和接口。


IE 3.0 和 Netscape Navigator 3.0 提供了一种特性 - BOM(浏览器对象模型),可以对浏览器窗口进行访问和操作。使用 BOM,开发者可以移动窗口、改变状态栏中的文本以及执行其他与页面内容不直接相关的动作。使 BOM 独树一帜且又常常令人怀疑的地方在于,它只是 JavaScript 的一个部分,没有任何相关的标准。


譬如:弹出新的浏览器窗口,移动、改变、关闭浏览器窗口,提供详细的网络浏览器信息(navigator object),详细的页面信息(location object),详细的用户屏幕分辨率的信息(screen object),对cookies的支持等。


BOM 主要处理浏览器窗口和框架,不过,通常浏览器特定 JavaScript 扩展都被看做 BOM 的一部分。这些扩展包括:


1)弹出新的浏览器窗口;


2)移动、关闭浏览器窗口以及调整窗口大小;


3)提供 Web 浏览器详细信息的定位对象;


4)提供用户屏幕分辨率详细信息的屏幕对象;


5)对 cookie 的支持;


6)IE 扩展了 BOM,加入了 ActiveXObject 类,可以通过 JavaScript 实例化 ActiveX 对象。


由于没有相关的 BOM 标准,每种浏览器都有自己的 BOM 实现。有一些事实上的标准,譬如:具有一个窗口对象和一个导航对象,不过每种浏览器都可为这些对象或其他对象定义自己的属性和方法。


编程

JavaScript 是一种脚本语言,其源代码在发往客户端运行之前不需经过编译,而是将文本格式的字符代码发送给浏览器由浏览器直接解释运行。


直译语言的弱点是安全性较差,而在 JavaScript 中,如一条运行不了,那么,下面的语言也无法运行。而其解决办法就是使用 try{}catch(){}︰


  1. console.log("a");  //这是正确的
  2. console.log("b");  //这是正确的
  3. console.logg("c"); //这是错误的,且到这里会停下来
  4. console.log("d");  //这是正确的
  5. console.log("e");  //这是正确的
  6.  
  7. /*解决办法*/
  8. try{console.log("a");}catch(e){}  //这是正确的
  9. try{console.log("b");}catch(e){}  //这是正确的
  10. try{console.logg("c");}catch(e){} //这是错误的,但到这里不会停下来,而是跳过
  11. try{console.log("d");}catch(e){}  //这是正确的
  12. try{console.log("e");}catch(e){}  //这是正确的
复制代码

版本历史

#
版本
发布时间
基于
Netscape Navigator
Mozilla Firefox
Internet Explorer
Opera
Safari
Google Chrome
011.01996年3月
2.0




021.11996年8月
3.0
3.0


031.21997年6月
4.0-4.05




041.31998年10月ECMA-262 1 edition / ECMA-262 2 edition4.06-4.7x
4.0


051.4

NetscapeServer




061.52000年11月ECMA-262 3 edition6.01.05.5 (JScript 5.5)
 6 (JScript 5.6)
 7 (JScript 5.7)
 8 (JScript 6)
6.0
7.0
8.0
9.0


071.62005年11月1.5 + Array extras + Array and String generics + E4X
1.5

3.0, 3.1
081.72006年10月1.6 + Pythonic generators + Iterators + let
2.0

3.2, 4.01.0
091.82008年6月1.7 + Generator expressions + Expression closures
3.0
11.50

101.8.1
1.8 + Native JSON support + Minor Updates
3.5



111.8.22009年6月22日1.8.1 + Minor updates
3.6



121.8.52010年7月27日1.8.1 + ECMAScript 5 Compliance
4911.60


扫一扫关注 德云社区 微信公众号

版权声明:
本文为独家原创稿件,版权归 德云社区,未经许可不得转载。
AI人工智能 语音助理 人工翻译 教程
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

Archiver|Sitemap|小黑屋|德云社区 |网站地图  

GMT+8, 2024-11-27 07:35 , Processed in 0.033313 second(s), 30 queries .

工业和信息化部: 粤ICP备14079481号-2

技术支持 乐数软件     版权所有 © 2014-2021 德云社区    

快速回复 返回顶部 返回列表