前端入门之深入了解JavaScript的运行原理和术语-永久免费的源码丞旭猿

如果您正在考虑全面系统学习JavaScript 的话！那么在开始之前了解一些有关这种编程语言的一般知识会很有帮助。本期目标是带你了解JavaScript的整体运行原理和专业术语背后！

高层次定义 JavaScript

JavaScript 是一种编程语言，可让开发人员在网页上实现复杂的操作。除了静态信息之外， 网站上所有绝大部分的内容都是JavaScript呈现的，例如滚动视频点唱机、动画图形、交互式地图和内容更新。

JavaScript 建立在CSS 和 HTML 事实上，它们本质上是网页底层，从 HTML 开始，然后是用于样式的 CSS 和用于动态行为的 JavaScript。

回顾一下，HTML 是一种定义段落并提供结构的标记语言，而 CSS 包含样式规则并将它们应用于 HTML。

了解编译代码与解释代码

JavaScript是一种轻量级的解释型编程语言。当您使用解释型语言时，无需在浏览器运行之前转换代码。相反，在代码从文档的顶部到底部运行后，您将立即获得结果。

相比之下，编译语言需要在计算机运行之前编译或转换为另一种形式。一个例子是 C++，因为它必须被编译成计算机运行的汇编语言。

了解客户端与服务器端代码

JavaScript也非常通用，可用于服务器端和客户端代码。服务器端代码在服务器中运行，结果下载并显示在浏览器中。或者，客户端代码是在计算机上运行的；当您访问一个网站时，您的浏览器会下载客户端代码，然后运行并显示它。

了解动态与静态代码

最后，JavaScript用于客户端和服务器端的动态代码，指的是网页能够根据情况显示各种显示，以及在必要时生成新内容的能力。

虽然静态代码始终显示相同的内容，但动态代码会实时更新内容。

对于客户端代码，JavaScript在浏览器中生成新内容。例如，创建一个 HTML 表格，用来自服务器的数据填充它并在网页上显示它。使用服务器端代码，可以在服务器中创建新内容，例如从现有数据库中获取数据。

探索 JavaScript 能做什么

JavaScript的核心元素可以处理一系列任务和功能，其中最常见的之一是将值存储在变量中。例如，要求用户输入他们的名字，然后将其存储在一个名为name的变量中。

JavaScript还可以对字符串或文本片段执行操作，以及运行代码作为对特定网页事件的响应，例如确定按钮是否被点击的点击事件，并在它被点击时运行代码。

API接口

为了获得更多功能，应用程序编程接口 (API)构建在核心 JavaScript 语言之上，让您能够以非凡的方式使用JavaScript 代码。将 API 视为提供预制的代码构建块，让您创建和实现一个原本证明具有挑战性的程序。简而言之，无需从头开始编写代码。

API 通常通过浏览器或第三方提供。浏览器 API 是 Web 浏览器的一部分，可以执行复杂的操作，这些操作在周围的计算机环境中很有用或暴露数据。示例包括可以创建 3D 或 2D 动画图形的WebGL和CanvasAPI；检索地理信息以补充您的 JavaScript 的地理定位 API；以及允许操作 CSS 和 HTML 的文档对象模型 (DOM) API。还有视频和音频浏览器 API。

第三方 API 通常会将其信息和代码放到网上，但它们不会自动内置到您的浏览器中。示例包括OpenStreetMap API、Google Maps API和Twitter API、微信 API。前者让您可以做一些事情，例如在您的网站上嵌入自定义地图，而后者可以让您显示您最近的社交媒体活动或执行类似的操作。

当然，这只是各种浏览器和第三方 API 的一小部分示例。

使用 JavaScript 的浏览器安全性

每当您打开一个新的浏览器选项卡时，它都会打开一个独特的执行环境来运行代码，因此一个选项卡的内容不会影响其他选项卡的内容。从安全的角度来看，这使得从网站窃取代码变得更加困难。JavaScript 培训可能会涵盖更高级的流程，例如在选项卡之间安全地发送数据和代码。

当 JavaScript 在页面上运行时

当您加载网站时，代码会在执行环境中运行。代码将是HTML、CSS和JavaScript，而执行环境是浏览器选项卡。在执行JavaScript之前，CSS和HTML必须加载到页面上。

换句话说，页面的样式、结构和内容在 JavaScript 开始运行之前就已经确定了。当 JavaScript 动态修改 CSS 和 HTML 以更新用户界面时，这种操作顺序有助于减少错误。

JavaScript 运行顺序

JavaScript 的运行顺序很简单：它按顺序运行，从顶部开始向下运行。虽然这可能是您所期望的，但这也意味着您需要注意放置代码的顺序，在代码中比实际需要的更早定义对象。

为避免任何错误，请务必在引用之前定义对象。

添加 JavaScript

与 CSS 类似，有一系列方法可用于将 JavaScript 添加到您的页面。CSS 依赖于