初识JavaScript

79 阅读3分钟

前言

大家好,我是一名前端学习者,为了方便个人的及时复习和给一起学习JS的小伙伴做参考,所以创建了一个 JavaScript 学习系列,今天的文章正是该系列的第一篇--初识JavaScript。

JavaScript 历史

  • 作者是布兰登-艾奇( Brendan Eich , 1961年~ )

2ee36c9ed607248675ec57d5aee35c88.jpg

  • 艾奇在1995年利用10天完成 JavaScript设计

  • 网景公司最初命名为 LiveScript,后来在和 Sun 合作之后将其改名为 JavaScript。

JavaScript 是什么?

  • JavaScript是世界上最流行的语言之一,是一种运行在客户端的脚本语言( Script 是脚本的意思)

  • 脚本语言: 不需要编译,运行过程中由 JS 解释器(JS引擎)逐行来进行解释并执行

  • 现在也可以基于 Node.js 技术进行服务器端编程

ed988e55cced7728fe235c38c47075f0.jpg

为了阅读方便,咱们约定将 JavaScript 简称为 JS。

JavaScript的作用

  • 表单动态校验(密码强度检测)( JS产生最初的目的

12b75155bd5a7000234d2e32833da9c1.jpg

如上图,如果咱们输入12,点击提交,这个数据并不会传到后端去校验,而是在本页面就会去校验输入的数据格式是否正确,正才会传到后端,执行下一步,不正确就会提示正确的格式是什么样子的。

  • 网页特效

77cac647813979792dc48a74c1793905.jpg

如上图,当我的鼠标放到新品这个标签的时候,网页自动就会展示一些东西。

  • 服务端开发( Node.js ): 前后端都能兼顾

  • 桌面程序: 日历,小时钟,计划表等

  • App : facebook,instagram,多邻国等

  • 控制硬件-物联网: 智能家居系统,智能农业监控等

  • 游戏开发:羊了个羊,贪吃蛇,微信跳一跳,2048,超级玛丽的网页版等

HTML/CSS/JS 的关系

HTML/CSS标记语言--描述类语言

  • HTML 决定网页结构和内容(决定看到什么),相当于人的身体

  • CSS决定网页呈现给用户的模样(决定好不好看),相当于给人穿衣服,化妆

JS 脚本语言--编程类语言

  • 实现业务逻辑和页面控制(决定功能),相当于人的各种动作

浏览器执行 JS 简介

浏览器分为两部分 :渲染引擎和 JS 引擎

  • 渲染引擎:用来解析 HTML 与 CSS,俗称内核,比如 cchrome 浏览器的 blink ,老版本的 webkit

  • JS 引擎:也称为 JS 解析器。用来读取网页中的 JS 代码,对其处理后运行,比如 chrome 浏览器的V8

注意:浏览器本身不会执行 JS 代码,而是通过内置 JS 引擎(解析器)来执行 JS 代码, JS 引擎执行代码是逐行解释每一句源代码(转换为机器语言),然后由计算机去执行,所以 JS 语言归为脚本语言,会逐行解释执行

例子:

image.png

如图,当JS引擎执行代码来到第八行时,把高级语言转换成二进制的机器语言(0和1组成),然后识别之后去执行第八行,到第九行也重复此过程,翻译一句执行一句,翻译解释一句执行一句,这种逐行解释的过程的语言就叫做脚本语言

好了这次与 JS 的初体验就到这里啦,有任何问题,无论是文章中存在的错误还是有模糊的描述,恳求各位前辈欢迎到评论区讨论,甜味弥漫期待与您的下次见面!