JavaScript 简介

JavaScript 简介

原文链接

JavaScript ( 简称:JS ) 是一种 轻量级解释型 的编程语言,其函数是一等公民。众所周知,它是用于网页开发的脚本语言,但也被用在很多非网页环境中,例如 node.js 和 Apache CouchDB。JS是一种基于原型的、多范式、动态脚本语言,并且支持面向对象、命令式和声明式(如:函数式编程)编程风格。【MDN】

Javascript 是一种解释性、直译型脚本语言(代码不进行预编译)。直译语言的弱点是安全性较差,而且在JavaScript中,如果一条执行不了,那么下面的语言也无法执行。而其解決办法就是使用 try{}catch(){}

console.log("a");
console.log("b");    
console.logg("c"); // 这里出错了,下面的语句不会被执行
console.log("d");
console.log("e");

/*解決办法*/
try{console.log("a");}catch(e){}
try{console.log("b");}catch(e){}
try{console.logg("c");}catch(e){console.log("Wrong here!");} 
 // 上面的语句是错误的,但是到这里不会停下来,而是打印错误提示信息,然后继续执行下面的语句
try{console.log("d");}catch(e){}
try{console.log("e");}catch(e){}

一个完整的 JavaScript 的实现应该包括三部分:

  • ECMAScript(语言核心):描述了该语言的语法和基本对象

  • DOM(文档对象模型):描述了处理网页内容的方法和接口

  • BOM(浏览器对象模型):描述了与浏览器进行交互的方法和接口

ECMAScript

ECMAScript 是一种脚本语言标准,规范名为 ECMA-262,JavaScript 成为 ECMAScript 的实现之一,其它实现 ECMAScript 的语言还有 JScript 和 ActionScript。

通常遇到 ECMAScript,就将 JavaScript 当作它的方言就行了!

ECMAScript 历史版本

  • ECMAScript 1 (1997.06)

  • ECMAScript 2 (1998.06)

  • ECMAScript 3 (1999.12)

    • 添加正则表达式,异常处理,新的控制指令等

  • ECMAScript 4 : 由于某些原因,未完成

  • ECMAScript 5 (2009.12)

    • 添加严格模式,JSON 对象等

  • ECMAScript 5.1 (2011.06)

    • 完全向下兼容 ECMAScript 3

  • ECMAScript 6 (2015.06) (又称 ES6ECMAScript 2015

    • 添加 let、const,箭头函数,解构赋值,类(class),模块支持等

  • ECMAScript 7 (2016.06) (又称 ES7ECMAScript 2016

    • 添加 Array.prototype.includes 、 取幂操作符(**)等

DOM

文档对象模型 ( DOM ) 是 HTML 和 XML 文档的编程接口。它给文档(结构树)提供了一个结构化的表述并且定义了一种程序可以对结构树进行访问,以改变文档的结构,样式和内容的方式。

DOM 标准的目标是让“任何一种程序设计语言”能操控使用“任何一种标记语言”编写出的“任何一份文档”。“操控”具体含义为能通过DOM提供的API对文档的内容、结构、样式进行访问和修改。

  • 简单讲,DOM 就是一组适用于结构化文档的API

  • DOM 并不是 JavaScript 的一部分,它也可以被其他语言使用,比如 Java 也可以操作 DOM

平时可能会见到有 DOM 0级(DOM Level 0),但实际上 DOM 0级并不存在,它只是DOM历史坐标中的一个参照点而已。具体说呢,DOM 0级指的是 IE4 和 Netscape 4.0 这些浏览器最初支持的 DHTML。

  • DOM Level 1 (1998.10)

    • DOM1 核心(DOM Core):规定了如何映射基于 XML 的文档结构,以便简化对文档的任意部分的访问和操作。

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

  • DOM Level 2 (2000.11)

    • DOM2 核心:扩展了 DOM1 核心

    • DOM2 视图(DOM Views):定义了跟踪不同文档(例如,应用CSS之前和之后的文档)视图的接口

    • DOM2 事件(DOM Events):定义了事件和事件处理的接口

    • DOM2 样式(DOM Style):定义了基于CSS为元素应用样式的接口

    • DOM2 遍历和范围(DOM Traversal and Range):定义了遍历和操作文档树的接口

    • DOM2 HTML:扩展了 DOM1 HTML

  • DOM Level 3(2004.04)

    • DOM3 核心: 扩展了 DOM1 和 DOM2 核心

    • DOM3 加载和保存(DOM Load and Save):定义了以统一方式加载和保存文档的方法

    • DOM3 验证(DOM Validation):

    • DOM3 事件:扩展了 DOM2 事件

    • DOM3 XPath:定义了在DOM中对XPath表达式求值的接口

  • DOM Level 4(2015.11)

    • ....coming

From wiki

  • DOM Level 1 provided a complete model for an entire HTML or XML document, including means to change any portion of the document.

  • DOM Level 2 was published in late 2000. It introduced the getElementById function as well as an event model and support for XML namespaces and CSS.

  • DOM Level 3, published in April 2004, added support for XPath and keyboard event handling, as well as an interface for serializing documents as XML.

  • DOM Level 4 was published in 2015. It is a snapshot of the WHATWG living standard.

了解更多,参看 DOM Current Status [ W3C ]

BOM

  • 浏览器对象模型(BOM),它为 Javascript 提供了访问和操作浏览器窗口的方法和对象

  • BOM 的核心:window 对象

  • BOM 本身一直都没有相关的标准,但是 HTML 5 发布后,W3C 为了把浏览器中 Javascript 最基本的部分标准化,已经将 BOM 的主要方面纳入了 HTML5 的规范中。

参考资料


percy507的编程之路
自2016年加入社区后,陆陆续续发布过一些文章,后面也自己折腾过个人博客(hexo+github)。但是自2018年...

主修前端,

962 声望
54 粉丝
0 条评论
推荐阅读
使用vite搭个中后台系统的脚手架
搭个中后台系统的脚手架仓库地址 [链接]搭建脚手架目的学习 vite、recoil 等新技术封装项目中常用的较复杂的组件学习一定的前端架构能力构建命令npm 与 yarn 对新版 husky(v7.0.1+)的配置方式不太相同,我们这...

percy5072阅读 3.2k

封面图
JavaScript有用的代码片段和trick
平时工作过程中可以用到的实用代码集棉。判断对象否为空 {代码...} 浮点数取整 {代码...} 注意:前三种方法只适用于32个位整数,对于负数的处理上和Math.floor是不同的。 {代码...} 生成6位数字验证码 {代码...} ...

jenemy49阅读 7.4k评论 12

再也不学AJAX了!(二)使用AJAX ① XMLHttpRequest
「再也不学 AJAX 了」是一个以 AJAX 为主题的系列文章,希望读者通过阅读本系列文章,能够对 AJAX 技术有更加深入的认识和理解,从此能够再也不用专门学习 AJAX。本篇文章为该系列的第二篇,最近更新于 2023 年 1...

libinfs42阅读 7k评论 12

封面图
「多图预警」完美实现一个@功能
一天产品大大向 boss 汇报完研发成果和产品业绩产出,若有所思的走出来,劲直向我走过来,嘴角微微上扬。产品大大:boss 对我们的研发成果挺满意的,balabala...(内心 OS:不听,讲重点)产品大大:咱们的客服 I...

wuwhs32阅读 3.6k评论 5

封面图
安全地在前后端之间传输数据 - 「3」真的安全吗?
在「2」注册和登录示例中,我们通过非对称加密算法实现了浏览器和 Web 服务器之间的安全传输。看起来一切都很美好,但是危险就在哪里,有些人发现了,有些人嗅到了,更多人却浑然不知。就像是给门上了把好锁,还...

边城29阅读 6.4k评论 5

封面图
2022大前端总结和2023就业分析
我在年前给掘金平台分享了《2022年热点技术盘点》的前端热点,算是系统性的梳理了一下我自己对前端一整年的总结。年后,在知乎上看到《前端的就业行情怎么样?》,下面都是各种唱衰前端的论调,什么裁员,外包化...

i5ting27阅读 2.4k评论 4

封面图
深入理解React Diff算法
fiber上的updateQueue经过React的一番计算之后,这个fiber已经有了新的状态,也就是state,对于类组件来说,state是在render函数里被使用的,既然已经得到了新的state,那么当务之急是执行一次render,得到持有新...

nero31阅读 11.8k评论 3

主修前端,

962 声望
54 粉丝
宣传栏