百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术文章 > 正文

JavaScript 简史

myzbx 2024-12-08 16:39 15 浏览

作者 | 泰斗贤若如

来源 | 泰斗贤若如

这次写一篇对于JavaScript的简介,我们知道的编程语言有很多种,比如Java、C++、Python等等,每种编程语言都有其独具的特色,不论是语法格式还是表达形式,都能让每个程序员沉淀在知识的海洋里难以自拔。

即每种编程语言都有无限的延展性,但如果我们考虑问题的时候追溯其根源,其实也不难发现每种编程语言都具有共同的初心,最直白的话就是人与计算机进行沟通的语言,在现实生活中,见什么人说什么话我们都很清楚,那在与计算机沟通的世界中,做什么事用什么编程语言沟通也是同样的道理,前提就是我们要了解这些编程语言,在你需要选择的时候做出正确的判断,这也正是我写此篇文章的意义。

JavaScript的历史由来

在1994年,当时的网景公司(Netscape)凭借Navigator这个浏览器成为了Web时代开启最著名的第一代的互联网公司。当时所用的第一版本的浏览器就是下图中的浏览器,相信有很多年轻朋友都没有见过这种浏览器。如果大家回想十年前或是十五年前,大家用的浏览器应该是IE浏览器,那个时候的浏览器跟现在的比如说谷歌浏览器、火狐浏览器等相比而言,那就是天壤之别了。

这个最早版本的浏览器,整个浏览器都是静态的,也就是用HTML和CSS写的,并没有像今天的各种浏览器一样具有各种各样的动态效果了,比如像网页的图片轮播、鼠标悬浮切换等效果。

网景公司就想在原来的静态页面的基础上添加一些动态的效果,这时候网景公司出来一个很牛的人物叫布兰登·艾奇,他用不到两周的时间就设计出了能在网页上实现动态效果的编程语言。

他设计出实现网页动态效果的编程语言,并将其编程语言命名为JavaScript。

为什么会命名为JavaScript呢?原因是在当时,Java非常火,网景公司希望借用Java在当时的名气来进行推广。其实事实上呢,JavaScript除了语法上有点像Java外,别的地方都跟Java没有任何关系。

JavaScript和ECMAScript的关系

从上面讲的JavaScript的由来中,我们就知道JavaScript由网景公司的布兰登·艾奇开发出来的,一年后,微软又模仿JavaScript开发出了一种编程语言叫JScript,再后来,陆续又有别的商家推出JavaScript的不同实现语言。这就导致JavaScript的语法和特性日益混乱,其标准化问题被提上日程。最终由欧洲计算机制造商协会(ECMA)以JavaScript1.1为蓝本,制定了【ECMA-262】标准,并由此标准定义了一种新脚本语言ECMAScript。随后,ISO也采用ECMAScript作为标准,各浏览器厂商便纷纷开始将ECMAScript作为各自JavaScript实现的基础。

那到底JavaScript和ECMAScript有什么关系呢?

ECMAScript其实并不等同于JavaScript,它只是JavaScript的核心标准(语法、类型、语句、关键字、保留字、操作符、对象),而JavaScript还包括文档对象模型(DOM)和浏览器对象模型(BOM)等。其中各主流浏览器对ECMAScript的支持都还不错,但对DOM的支持相差较大,对于BOM一直没有相关标准。最后再简单总结一下就是:ECMAScript是一种语言标准,JavaScript是对ECMAScript的一种实现。

JavaScript版本迭代

  • 1997年06月 :发布首版。

  • 1997年06月:修改规范完全符合ISO/IEC 16262国际标准。

  • 1998年6月,ECMAScript 2.0版发布。

  • 1999年12月,ECMAScript 3.0版发布,成为JavaScript的通行标准,得到了广泛支持。

  • 1999年12月:增加正则、更好的文字处理、新的控制语句、try/catch异常处理、更加明确的错误定义,数字输出格式等等。放弃发布。

  • 2007年10月,ECMAScript4.0版草案发布,对3.0版做了大幅升级,预计次年8月发布正式版本。草案发布后,由于4.0版的目标过于激进,各方对于是否通过这个标准,发生了严重分歧。以Yahoo、Microsoft、Google为首的大公司,反对JavaScript的大幅升级,主张小幅改动;以JavaScript创造者Brendan Eich为首的Mozilla公司,则坚持当前的草案。

  • 2008年7月,由于对于下一个版本应该包括哪些功能,各方分歧太大,争论过于激进,ECMA开会决定,中止ECMAScript 4.0的开发,将其中涉及现有功能改善的一小部分,发布为ECMAScript3.1,而将其他激进的设想扩大范围,放入以后的版本,由于会议的气氛,该版本的项目代号起名为Harmony(和谐)。会后不久,ECMAScript 3.1改名为ECMAScript 5。

  • 2009年12月:完善了ECMASript 3版本、增加"strict mode," (严格模式)、以及新的功能,如getter和setter、 JSON库支持和更完整的对象属性。ECMAScript 5.0版正式发布。Harmony项目则一分为二,一些较为可行的设想定名为JavaScript.next继续开发,后来演变成ECMAScript 6;一些不是很成熟的设想,则被视为JavaScript.next.next,在更远的将来再考虑推出。

  • 2011年06月:ECMAscript 5.1版发布,并且成为ISO国际标准(ISO/IEC 16262:2011)。

  • 2013年3月,ECMAScript 6草案冻结,不再添加新功能。新的功能设想将被放到ECMAScript 7。

  • 2013年12月,ECMAScript 6草案发布。

  • 2015年06月:第六版的名字有很多,可以叫ECMAScript6 (ES6) ,也可以叫ECMAScript 2015 (ES2015) 。

  • 2015年6月17日,ECMAScript 6发布正式版本,即ECMAScript 2015。

  • 2016年06月:也被称为ECMAScript 2016。完善ES6规范,还包括两个新的功能:求幂运算符(*) 和array.prototype.includes方法。

  • 2017年06月:增加新的功能,如并发、原子操作、Object.values/Object.entries、 字符串填充、promises、 await/asyn等等。

JavaScript的组成部分

JavaScript的三个主要组成部分是:ECMAScript(核心),DOM(文档对象模型),BOM(浏览器对象模型)。

ECMAScript(核心)

【ECMA-262】并没有参照web浏览器,规定了语言的组成部分,其具体内容包括语法、类型、语言、关键字、保留字、操作符、对象等。

ECMAScript的兼容:

  1. 支持【ECMA-262】描述的所有“类型、值、对象、属性、函数以及程序语法和语义” 。

  2. 支持Unicode字符标准。

  3. 添加【ECMA-262】没有描述的更多“类型、值、对象、属性和函数”,【ECMA-262】说的这些新增特性,主要是指该标准中没有规定的新对象和对象的新属性。

  4. 支持【ECMA-262】中没有定义的“程序和正则表达式的语法”。也就是说可以修改和扩展内置的正则表达式语法。

DOM(文档对象模型)

文档对象模型(DOM)是针对XML但经过扩展用于HTML的应用程序编程接口(API)。DOM把整个页面映射为一个多层次节点结构。HTML或者XML页面中的每个组成部分都是某种类型的节点,这些节点又包含着不同类型的数据。

其实说白了,文档对象模型(DOM)就是操作网页上的那些标签,来实现动态的效果。

在DOM中,页面一般可以用分层节点图表示:

DOM级别:

  • DOM1级于1998年10月成为W3C的推荐标准。BOM1由两个模块组成分别是DOM core和DOM HTML。

  • DOM core:规定如何映射基于XML的文档结构,以便简化对文档中任意部分的访问和操作。

  • DOM HTML:在DOM core的基础上加以扩展,添加了针对HTML的对象和方法。

  • DOM2级在原来DOM的基础上有扩充了鼠标和用户界面事件、范围、遍历等细分模块,通过对象接口增加了对css的支持。包括以下模块:

  1. DOM Views(DOM视图):定义了跟踪不同文档视图的接口。

  2. DOM Events(DOM事件):定义了事件与事件处理的接口。

  3. DOM Traversal and Range(DOM遍历和范围):定义了遍历和操作文档的接口。

  • DOM3级则进一步扩展了DOM,引入了加载和保存模块以统一方式加载和保存文档的方法;新增了DOM验证模块主要还是验证文档的方法。

BOM(浏览器对象模型)

浏览器对象模型(BOM)是处理浏览器窗口和框架,我们习惯上把所有针对浏览器的JavaScript扩展算作是BOM的一部分。包括以下:

  1. 弹出新浏览器窗口的功能。

  2. 移动、缩放和关闭浏览器窗口的功能。

  3. 提供浏览器所加载页面的详细信息的navigator对象。

  4. 提供浏览器所加载页面的详细信息的location对象。

  5. 提供用户分辨率详细信息的screen对象。

  6. 对cookies的支持。

  7. 像XMLHttpRequest和IE的ActionXobject这样的自定义对象。

浏览器对象模型(BOM)其实很简单,它包含了当前浏览器上的一些操作,比如说像关闭按钮、刷新按钮、前进和后退按钮等等。

综上来说,JavaScript就包含了以上这三部分内容,第一部分就是核心基础语法,这是非常非常重要的东西,有了核心基础的铺垫,我们才能后续的学习文档对象模型(DOM)和浏览器对象模型(BOM)。文档对象模型(DOM)就是操作一些网页上的一些标签元素,来实现网页上的动态效果。

而浏览器对象模型(BOM)就是像比如说滚动的行为,点击回到顶部,还有刷新,前进,后退等操作。这些特性就是我们需要了解的内容,在你后续进行详细学习的时候,就带着这些特性疑问去学习,会有事半功倍的效果。

?微信Android版支持改微信号,淘宝硬核拒绝改名要求;5G 套餐价格松动;Kotlin 1.4 第二个预览版发布|极客头条

?跨行成为程序员的 15 个实用技巧!

?程序员摆地摊的正确姿势!

?全网唯一秃头数据集:20万张人像,网罗各类秃头

?一个神秘URL酿大祸,差点让我背锅!

?Uber 前无人驾驶工程师告诉你,国内无人驾驶之路还要走多久?

相关推荐

一键生成高颜值图表!让你的文字瞬间有画面感,职场人必备!

哈喽,打工人们!忙碌的周中,大熊又来给你们带来一个超实用的效率神器啦!这次的宝藏网站绝对是那种用过就离不开的"真香"型产品!假设你明天就要做重要汇报,可面对一大堆密密麻麻的文字材料,你...

批量将 Word 转换为 PDF/Excel/Txt/图片等多种格式

Word文档是我们工作中经常会打交道的一种文档格式,我们也经常会有需要对Word文档进行格式转换的需求,比如将Word格式转换为PDF、将Word文档转换为Excel、将Word...

绝了!一键用AI生成高颜值动态PPT(附详细步骤+Prompt)

大家好,我是一名酷爱研究AI的产品经理,最近我有个新发现:那些花了你3天做出来的PPT,现在用AI可以1小时搞定!而且颜值还高!为什么AI做PPT比传统方式效率高10倍?我用一张图就能告诉你:AI生成...

ztext - 简单几行代码创建酷炫3D特效文字的开源JS库

把网页上的文字变成酷炫的3D风格,还能制作旋转动效,有了ztext.js,只需要几行代码。ztext能做什么ztext.js是一个能把常规的平面文字变成3D样式的前端开源代码库,让开发者...

文字内插入小图片,也太可爱了吧(文字中怎么插图片)

图文排版H5手机版秀米有小伙伴留言问添加图片的时候可不可以把图片添加到文字之间比如下面这句话中的小贴纸图片后面可以接着输入文字其实吧这就是咱们的『文字内插入小图片』功能嘛可以用来在文字内加个表情包又...

Linux环境下C++代码性能分析方法(linux怎么写c++代码)

技术背景在开发C++应用程序时,找出代码中运行缓慢的部分是进行性能优化的关键。在Linux系统上,有多种工具和方法可用于对C++代码进行性能分析,每种方法都有其特点和适用场景。实现步骤手动中断调试法在...

SVG互动图文,让你的文章更有趣!教你4种简单易学的黑科技玩法!

如果你是一个公众号创作者,那么你一定想知道如何让你的文章更加吸引人,更加有趣,更加有创意。你可能已经尝试过各种图文排版技巧,但是你是否知道,有一种黑科技可以让你的文章变得更加酷炫,更加互动,更加爆款?...

Videoscribe怎么实现实心中文汉字的手绘制作

很多朋友在制作手绘视频的时候,不知道怎么输入实心的中文汉字,之前我们已经给大家分享了怎么输入汉字的方法,但是有一点遗憾的是输出的汉字是空心的手绘展示,在视觉上并不是非常的美观。经过大家不断的探索,终于...

一款用于将文本转化成图表的现代化脚本语言

大家好,又见面了,我是GitHub精选君!今天要给大家推荐一个GitHub开源项目terrastruct/d2,该项目在GitHub有超过10.3kStar,用一句话介绍该项目就是:...

探秘 Web 水印技术(制作水印网站)

作者:fransli,腾讯PCG前端开发工程师Web水印技术在信息安全和版权保护等领域有着广泛的应用,对防止信息泄露或知识产品被侵犯有重要意义。水印根据可见性可分为可见水印和不可见水印(盲水印)...

不忍心卸载的五款神仙工具(不忍心卸载的五款神仙工具是什么)

001.效率工具uTools-装机必备的生产力工具集uTools是一款非常强大的可以装下几乎所有效率工具的电脑生产力工具集,目前拥有Windows、Mac和Linux三个版本。软件界面...

「SVG」飞花令!这份最高检工作报告“超有料”

原标题:【SVG】飞花令!这份最高检工作报告“超有料”栏目主编:秦红文字编辑:沈佳灵来源:作者:最高人民检察院...

svg|2025政府工作报告,有没有你关心的数据?

··<setattributeName="visibility"begin="click+0s"dur="1ms"fill="freeze"restart="never"to="hi...

videoscribe只能输入英文,如何输入中文文本?

videoscribe只能输入英文,如何输入中文文本?打开VideoScribe软件,打开要添加中文字体的位置。打开Photoshop并在文件中创建一个新的透明背景图层。注意:必须是透明背景层。...

五个流行的SVG在线编辑器(svg编辑工具)

随着响应网络的发展,越来越多的高质量的SVG在线编辑器被公众所熟知。SVG矢量图形也越来越受欢迎,以便在任何设备上呈现图像,甚至一些易于使用的SVG在线编辑器,可以替代PS,本文总结了五种流行的SVG...