目  录

 一、实验目的

二、实验环境

三、实验步骤和内容

1、小组成员分工（共计4人）

2、实验方案

3、实验结果与分析

Ⅰ、简述JavaScript的产生过程与Java的关系

Ⅱ、简述JavaScript的特点有哪些

Ⅲ、简述ECMAScript的历史

Ⅳ、简述ECMAScript与JavaScript的关系

Ⅴ、简述ES6与ES5的关系

Ⅵ、简述ES6的特点和新改进的内容

Ⅶ、简述Node.js、TypeScript、Jquery的概念以及与JavaScript的关系

4、项目任务评价

四、遇到的问题和解决方法

五、实验总结

---

 一、实验目的

        1、了解JavaScript语言产生的原因和历史

        2、了解ECMAScript 的发展过程

        3、了解ES5、ES6的学习方法和特点

        4、了解Node.js、TypeScript、jQuery的概念，及与javascript的关系

---

二、实验环境

        1、硬件要求：笔记本电脑一台。

        2、软件要求：Windows操作系统，使用Eclipse编译环境、Tomcat服务器以及Microsoft Edge浏览器。

        3、网络要求：能访问互联网。

---

三、实验步骤和内容

1、小组成员分工（共计4人）

        （1）组长——锦鲤

        通过查找相关文案、书籍或者一些网络资源，简述JavaScript的产生过程与Java的关系；JavaScript的特点有哪些；ECMAScript的历史；ECMAScript与JavaScript的关系；ES6与ES5的关系；ES6的特点和新改进的内容；Node.js、TypeScript、Jquery的概念以及与JavaScript的关系。

        （2）组员——西瓜

        通过查阅一些资源简述JavaScript的产生过程与Java的关系；JavaScript的特点有哪些；ECMAScript的历史；ECMAScript与JavaScript的关系；ES6与ES5的关系；ES6的特点和新改进的内容；Node.js、TypeScript、Jquery的概念以及与JavaScript的关系。

        （3）组员——南瓜

        通过查阅一些资源简述JavaScript的产生过程与Java的关系；JavaScript的特点有哪些；ECMAScript的历史；ECMAScript与JavaScript的关系；ES6与ES5的关系；ES6的特点和新改进的内容；Node.js、TypeScript、Jquery的概念以及与JavaScript的关系。

        （4）组员——葫芦瓜

        通过查阅一些资源简述JavaScript的产生过程与Java的关系；JavaScript的特点有哪些；ECMAScript的历史；ECMAScript与JavaScript的关系；ES6与ES5的关系；ES6的特点和新改进的内容；Node.js、TypeScript、Jquery的概念以及与JavaScript的关系。

2、实验方案

        1、根据课本、PPT和老师课堂中讲解的内容，进行文案资料的查找。

        2、对查找到的相关资源进行汇总，将需要的信息进行提取和记录。

        3、将查阅到的内容以模块的形式填写到文档之中。

        4、讨论并总结查找过程中出现的问题，对没有找到的内容进行小组讨论，进而完善各自的知识内容。

        5、完成最终的知识汇总以及各自的实验报告，最后进行实验报告排版的检测并提交。

3、实验结果与分析

Ⅰ、简述JavaScript的产生过程与Java的关系

        （1）JavaScript的产生过程

1. JavaScript借鉴C语言的基本语法；Java语言的数据类型和内存管理；Scheme语言，将函数提升到“第一等公民”（first class）的地位；Self语言，使用基于原型（prototype）的继承机制。
2. JavaScript被设计出来后最初命名为Mocha，1995年9月在Netscape Navigator 2.0的Beta版中改名为LiveScript，同年12月，Netscape Navigator 2.0 Beta 3中部署时被重命名为JavaScript。
3. 1996年11月，网景向ECMA提交语言标准，由于版权问题，JS 语言标准不叫 JavaScript，叫 ECMAScript。
4. 1997年6月，第一版ECMAScript发布。
5. 1999年12月，第三版ECMAScript发布，这个版本使用最广。
6. 2006 年，jQuery 发布，它是目前最长寿的 JS 库。
7. 2009年12月，第五版ECMAScript发布，增加了一些功能。
8. 2009 年，Ryan 基于 V8 （Chrome 的 JS 引擎叫做 V8）创建了 Node.js。
9. 2010年，Isaac基于node.js写出了npm。
10. 2015年6月，第六版ECMAScript发布，新浏览器都支持这一版（之后每年发布一版，版本号以年份命名）。

​​​​​​​        （2）JavaScript与Java的关系

1. 一般认为，当时 Netscape 之所以将 LiveScript 命名为 JavaScript，是因为 Java 是当时最流行的编程语言，带有"Java" 的名字有助于这门新生语言的传播。
2. 它们的语法和 C 语言都很相似。
3. 它们都是面向对象的（虽然实现的方式略有不同）。
4. JavaScript在设计时参照了Java的命名规则。
5. JavaScript是动态类型语言，而Java是静态类型语言。
6. JavaScrip是弱类型的，Java属于强类型。
7. JavaScript的面向对象是基于原型实现的，Java是基于类实现的。
8. JavaScript除了长得和Java比较像之外，语言风格相去甚远。
9. JavaScript在设计时所参考的对象不包括 Java，而包括了像Self和Scheme这样的语言。

Ⅱ、简述JavaScript的特点有哪些

1. JavaScript是一种解释型的脚本语言，C、C++等语言先编译后执行，而JavaScript是在程序的运行过程中逐行进行解释。
2. JavaScript是一种基于对象的脚本语言，它不仅可以创建对象，也能使用现有的对象。
3. JavaScript采用的是弱类型的变量类型，对使用的数据类型未做出严格的要求，是基于Java基本语句和控制的脚本语言，其设计简单紧凑。
4. JavaScript是一种采用事件驱动的脚本语言，它不需要经过Web服务器就可以对用户的输入做出响应。在访问一个网页时，鼠标在网页中进行鼠标点击或上下移、窗口移动等操作JavaScript都可直接对这些事件给出相应的响应。
5. JavaScript依赖于操作系统，仅需要浏览器的支持。因此一个JavaScript脚本在编写后可以带到任意机器上使用，前提是机器上的浏览器支持JavaScript脚本语言，目前JavaScript已被大多数的浏览器所支持。
6. JavaScript（简称“JS”）是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。
7. JavaScript是基于原型编程、多范式的动态脚本语言，并且支持面向对象、命令式和声明式（如函数式编程）风格。

Ⅲ、简述ECMAScript的历史

1. ECMAScript是由网景的布兰登·艾克开发的一种脚本语言的标准化规范。
2. ECMAScript最初命名为Mocha，后来改名为LiveScript，最后重命名为JavaScript。
3. 1995年12月，升阳与网景联合发表了JavaScript。
4. 1996年11月，网景公司将JavaScript提交给欧洲计算机制造商协会进行标准化。
5. ECMA-262的第一个版本于1997年6月被Ecma组织采纳。
6. ECMAScript是ECMA-262标准化的脚本语言的名称。
7. 尽管JavaScript和JScript与ECMAScript兼容，但包含超出ECMAScript的功能。

Ⅳ、简述ECMAScript与JavaScript的关系

1. ECMAScript也是一门脚本语言，缩写为ES，通常看做JavaScript的标准化规范。
2. JavaScript是ECMAScript的扩展语言，因为ECMAScript只提供了最基本的语法，通俗点说只是约定了我们的代码如何编写，比如定义变量和函数、循环和分支，它只是停留在语言层面，并不能用来完成我们应用中的实际功能开发。
3. JavaScript实现了ECMAScript的语言标准，并且在这个基础之上做了一些扩展，使得我们可以在浏览器环境中操作DOM和BOM，在node环境中可以做读写文件之类的操作。
4. 在浏览器环境中，JavaScript=ECMAScript+BOM+DOM。
5. 在Node环境中，JavaScript=ECMAScript+Node APIs。

Ⅴ、简述ES6与ES5的关系

1. ECMAScript5，即ES5，是ECMAScript的第五次修订，于2009年完成标准化。
2. ECMAScript6，即ES6，是ECMAScript的第六次修订，于2015年完成，也称ES2015。
3. ES6是继ES5之后的一次改进，相对于ES5更加简洁，提高了开发效率。

Ⅵ、简述ES6的特点和新改进的内容

        （1）ES6的特点

1. let和const都是块级作用域。
2. 以{}代码块作为作用域范围只能在代码块里面使用，不存在变量提升，只能先声明再使用，否则会报错。
3. 在代码块内，在声明变量之前，该变量都是不可用的，这在语法上，称为“暂时性死区”。
4. 在同一个代码块内，不允许重复声明，const声明的是一个只读常量，在声明时就需要赋值。
5. 如果const的是一个对象，对象所包含的值是可以被修改的。
6. 对象所指向的地址不能改变，而变量成员是可以修改的。
7. 模板字符串（Template String）用一对反引号(`)标识，它可以当作普通字符串使用，也可以用来定义多行字符串，也可以在字符串中嵌入变量，js 表达式或函数，变量.js 表达式或函数需要写在${ }中。
8. ES6为参数提供了默认值。在定义函数时便初始化了这个参数，以便在参数没有被传递进去时使用。
9. 在ES6中，提供了一种简洁的函数写法，我们称作“箭头函数”。
10. 箭头函数中的this始终指向箭头函数定义时的离this 最近的一个函数，如果没有最近的函数就指向window。

        （2）ES6新改进的内容

1. 新增声明命令let和const，在 ES6 中通常用let和const来声明，let表示变量、const表示常量。
2. ES6允许在对象之中，直接写变量。这时属性名为变量名, 属性值为变量的值。
3. Object.keys()方法，获取对象的所有属性名或方法名（不包括原形的内容），返回一个数组。
4. Object.assign ()，assign方法将多个原对象的属性和方法都合并到了目标对象上面。可以接收多个参数，第一个参数是目标对象，后面的都是源对象。
5. ES6标准中，JavaScript原生支持模块(module)。这种将 JS 代码分割成不同功能的小块进行模块化，将不同功能的代码分别写在不同文件中，各模块只需导出公共接口部分，然后通过模块的导入的方式可以在其他地方使用。
6. Promise是异步编程的一种解决方案，将异步操作以同步操作的流程表达出来，避免了层层嵌套的回调函数，要是为了解决异步处理回调地狱(也就是循环嵌套的问题)而产生的 Promise 构造函数包含一个参数和一个带有 resolve（解析）和 reject（拒绝）两个参数的回 调。在回调中执行一些操作（例如异步），如果一切都正常，则调用 resolve，否则调用 reject。
7. 数组的解构赋值，解构赋值是对赋值运算符的扩展。是一种针对数组或者对象进行模式匹配，然后对其中的变量进行赋值。在代码书写上简洁且易读，语义更加清晰明了；也方便了复杂对象中数据字段获取。数组中的值会自动被解析到对应接收该值的变量中，数组的解构赋值要一一对应如果有对应不上的就是 undefined。
8. 对象的解构赋值，对象的解构赋值和数组的解构赋值其实类似，但是数组的数组成员是有序的 而对象的属性则是无序的，所以对象的解构赋值简单理解是等号的左边和右边的结构相同。
9. Set数据结构，类似数组，所有的数据都是唯一的，没有重复的值，它本身是一个构造函数。
10. class类的继承 ES6 中不再像 ES5 一样使用原型链实现继承，而是引入 Class 这个概念。
11. 展开运算符可以将数组或对象里面的值展开；还可以将多个值收集为一个变量。
12. 使用 async/await,搭配 Promise,可以通过编写形似同步的代码来处理异步流程,提高代码的简洁性和可读性async用于申明一个function是异步的，而 await用于等待一个异步方法执行完成。
13. Symbol是一种基本类型，Symbol通过调用symbol函数产生，它接收一个可选的名字参数，该函数返回的symbol是唯一的。

Ⅶ、简述Node.js、TypeScript、Jquery的概念以及与JavaScript的关系

        （1）Node.js与JavaScript的关系

1. JavaScript是一种脚本语言，而Node.js是一个让JavaScript运行在服务端的开发平台。
2. JS偏向前端浏览器，node偏向后端。
3. JS中的顶层对象是window对象，而node中的顶层对象是global对象。

        （2）TypeScript与JavaScript的关系

     1. JavaScript，也称为JS，是一种符合ECMAScript规范的编程语言。这是一个高级别的、通常是即时编译的、多范式的。Vanilla JavaScript是一个名称，用于指代使用普通JavaScript而无需任何其他库。

     2. JS是一种广泛使用的编程语言，用于客户端和服务器端，使网页具有交互性。

     3. JavaScript可用于以下用途：向网页添加交互行为；创建Web和移动应用程序；构建Web服务器和开发服务器应用程序。

     4. TypeScript是一种强类型、面向对象的编译语言。

     5. TypeScript也称为TS，是JavaScript(JS)遵循JavaScript的超集。简而言之，TS就是JS加上更多的附加功能。

     6. TypeScript支持其他JS库；因此TypeScript生成的JS可以重用所有现有的JavaScript框架、工具和库。

     7. TypeScript是可移植的。TS可以在任何运行JS的环境中运行，它可以跨浏览器、设备、操作系统等。

     8. TypeScript不需要专用的VM或特定的运行时环境来执行。

        （3）Jquery与JavaScript的关系

1. JavaScript是一种脚本语言，而jquery是一个JavaScript函数库，是JavaScript函数的集合。
2. jquery基于JavaScript语言，封装JavaScript的原生方法，提供了简便的函数接口，简化了JS的操作。
3. JavaScript 是一种脚本语言，主要用在浏览器中，实现对网页的文档对象的操作和一些用户交互动作的处理。
4. jQuery则是JavaScript的一个代码库(或习惯性叫类库)，它将一些在 JavaScript开发中经常用到的功能集合起来，以方便开发者直接使用，而不需要再用原生JavaScript语句写大量代码，同时可在不同浏览器间实现一致的效果。是当前最流行的 JavaScript 库之一。
5. jquery是基于JavaScript编写的，jquery全部都是JavaScript代码组成。
6. jquery封装JavaScript的原生方法，提供了简便的函数接口，简化了JS的操作。

4、项目任务评价

        1、每次对解决不了的问题在群里进行及时的反馈，进而组员之间相互合作、共同解决发现的问题，不但提高了对问题的解决效率，而且还加深了我们每一个人处理问题的能力。

        2、虽然在项目制作的过程中存在一定的问题，但是我们都会进行及时的调整，总的来说优点是大于缺点的，我们会继续保持好的的一方面，及时对缺点和不足进行改正和完善，让小组成员和自己的项目更加完善。

---

四、遇到的问题和解决方法

        1、运行问题：编写的代码在运行过程中出现了乱码现象。

解决方法：鼠标右击->Run As->Run Configurations->Common->在Other后填写gbk然后点击Run进行运行后中文可以正常输出。

        2、运行问题：代码编写完成后进行运行发现网页无法进行页面加载，显示页面请求失败。

解决方法：由于没有在Tomcat服务器上进行运行所导致，先运行服务器然后再运行代码后页面可以正常加载。

        3、运行问题：启动Tomcat的过程中，有时出现端口被占用的情况。

解决方法：对服务器进行配置，将服务器运行的端口号改为别的端口即可（找到Tomcat安装目录下的文件“/conf/server.xml”->使用记事本或写字板打开文件，在文件中找到“Connector port=8080”->将“8080”改为“8888”，然后保存配置文件->重启Tomcat服务器）。

        4、项目问题：对相关的知识、概念类问题进行阐述和解释时找不到资源。

解决方法：在CSDN或者菜鸟教程上有需要的所有信息的名词解释，在书上找不到资源时可以通过浏览器进行相关概念的搜索和整合。

---

五、实验总结

        1、在使用单引号和双引号的时候要特别注意，输出单个字符时可以使用单引号，如果同时输出多个字符时只能使用双引号进行输出，不然会报错。

        2、在对笔记本电脑进行配置时尽量不要使用C盘。

        3、熟练了解和掌握了JavaScript的产生过程与Java的关系、JavaScript的特点、ECMAScript的历史、ECMAScript与JavaScript的关系、ES6与ES5的关系、ES6的特点、新改进的内容、Node.js、TypeScript、Jquery的概念以及与JavaScript的关系的相关概念。