你了解JavaScript的js运行三部曲吗

目录
  • 1.1 语法分析
  • 1.2 预编译
    • 1.2.1 函数声明整体提升
    • 1.2.2 变量 声明提升
    • 1.2.3 imply global暗示全局变量
    • 1.2.4 预编译四部曲（预编译发生在函数执行的前一刻）
  • 1.3 解释执行
  • 总结

1.1 语法分析

预编译之前，先通篇扫描看看有没有语法错误

1.2 预编译

1.2.1 函数声明整体提升

声明函数的时候不管你写到哪里，都会把这个函数整体提升到最前面

1.2.2 变量 声明提升

只是把var a；提升到前面去，输出结果为undefined，声明提升

document.write(a);

var a=123；

1.2.3 imply global暗示全局变量

1. 定义：即任何变量，如果变量未经声明就赋值，此变量就为全局对象（window）所有

eg：a=10；

----------> window.a=10;

上面的代码：var声明了a，从右到左赋值，先将123赋给b，再给a，导致的结果就是b没有声明，即变为全局变量window所有，打印window.b有结果123，window.a没结果undefined。

2. 一切声明的全局变量，全是window（全局的域）的属性

1.2.4 预编译四部曲（预编译发生在函数执行的前一刻）

1.创建AO对象（Activation Object）活跃对象（作用域=执行器上下文），全局变量是GO（global object==window）

2.找形参和变量声明，将变量和形参名作为AO属性名，值为undefined

3.将实参值和形参统一（全局变量就没这步了）

4.在函数体里面找函数声明，值是函数体

例1：

建立函数

预编译看过的地方，执行函数的时候就不用在看了，下面是函数执行结果

例2：

函数执行完后打印出  1，2，2

 例3：

最后函数执行完了才把a变成10

例4：

1.3 解释执行

单线程,解释一行执行一行

总结

本篇文章就到这里了，希望能够给你带来帮助，也希望您能够多多关注我们的更多内容!

赞 (0)

相关推荐

  • JavaScript运行原理分析

    JavaScript是一种基于对象的动态.弱类型脚本语言(以下简称JS),是一种解释型语言,和其他的编程语言不同,如java/C++等编译型语言,这些语言在代码执行前会进行通篇编译,先编译成字节码(机器码).然后在执行.而JS不是这样做的,JS是不需要编译成中间码,而是可以直接在浏览器中运行,JS运行过程可分为两个阶段,编译和执行.(可参考你不知道的JS这本书),当JS控制器转到一段可执行的代码时(这段可执行代码就是编译阶段生成的),会创建与之对应的执行上下文(Excution Context简

  • JavaScript 高效运行代码分析

    作者 Mark 'Tarquin' Wilton-Jones · 2006年11月2日 本文翻译自 Efficient JavaScript 原译文地址 http://kb.operachina.com/node/207 传统上,网页中不会有大量的脚本,至少脚本很少会影响网页的性能.但随着网页越来越像 Web 应用程序,脚本的效率对网页性能影响越来越大.而且使用 Web 技术开发的应用程序现在越来越多,因此提高脚本的性能变得很重要. 对于桌面应用程序,通常使用编译器将源代码转换为二进制程序.编译

  • JavaScript运行机制实例分析

    本文实例讲述了JavaScript运行机制.分享给大家供大家参考,具体如下: 第一次写博客 目前研一第二学期,大二开始入门前端,然而长久以来都是对于框架的简单调用,并未对其进行深入研究,因此,这个博客是作为自我督促的开始.这篇博客的内容源于前段时间写一个微信小程序前端,发现页面的渲染顺序总与自己的预想相违背,因此近期看了一些关于JavaScript运行机制的博客及文档,有了一些基本的框架,接下来就来详细看一下我所了解到的内容. JavaScript执行顺序 首先,JavaScript是按照顺序,

  • javascript运行机制之执行顺序理解

    JavaScript是一种描述型脚本语言,它不同于java或C#等编译性语言,它不需要进行编译成中间语言,而是由浏览器进行动态地解析与执行.如果你不能理解javaScript语言的运行机制,或者简单地说,你不能掌握javascript的执行顺序,那你就犹如伯乐驾驭不了千里马,让千里马脱缰而出,四处乱窜. 那么JavaScript是怎么来进行解析的吗?它的执行顺序又是如何的呢?在了解这些之前,我们先来认识几个重要的术语:       1.代码块 JavaScript中的代码块是指由<script>

  • 前端 JavaScript运行原理

    前端 JavaScript运行原理

    目录 1.什么是JavaScript引擎 2.V8引擎 3.运行时环境 4.运行时的调用栈 5.异步任务 6.总结 1.什么是JavaScript引擎 JavaScript引擎是一个计算机程序,它的主要作用是JavaScript运行时将源码编译为机器码. 每个主流Web浏览器都有自己的JavaScript引擎,它通常由web浏览器供应商开发. Google Chrome V8. Mozilla Firefox Spider Monkey. Safari Javascript Core Webki

  • 你了解JavaScript的js运行三部曲吗

    你了解JavaScript的js运行三部曲吗

    目录 1.1 语法分析 1.2 预编译 1.2.1 函数声明整体提升 1.2.2 变量 声明提升 1.2.3 imply global暗示全局变量 1.2.4 预编译四部曲(预编译发生在函数执行的前一刻) 1.3 解释执行 总结 1.1 语法分析 预编译之前,先通篇扫描看看有没有语法错误 1.2 预编译 1.2.1 函数声明整体提升 声明函数的时候不管你写到哪里,都会把这个函数整体提升到最前面 1.2.2 变量 声明提升 只是把var a:提升到前面去,输出结果为undefined,声明提升 d

  • 手把手搭建安装基于windows的Vue.js运行环境

    手把手搭建安装基于windows的Vue.js运行环境

    Vue.js 是一套构建用户界面的渐进式框架.他自身不是一个全能框架--只聚焦于视图层.因此它非常容易学习,非常容易与其它库或已有项目整合.在与相关工具和支持库一起使用时,Vue.js 也能完美地驱动复杂的单页应用. 在配置环境之前呢,有些基础的东西还是要和大家普及一下的.如果你已经对Vue.js有所了解,那请点击 配置步骤 跳转到配置环境的阅读,否则,请耐心看完看完. 首先,介绍一下Vue.js的概念,他是干啥的呢?一定要配置vue的运行环境吗?   如上述Vue.js不是个全能的框架,因为他

  • 如何通过setTimeout理解JS运行机制详解

    如何通过setTimeout理解JS运行机制详解

    序 setTimeout()函数:用来指定某个函数或某段代码在多少毫秒之后执行.它返回一个整数,表示定时器timer的编号,可以用来取消该定时器. 例子 console.log(1); setTimeout(function () { console.log(2); }, 0); console.log(3); 问:最后的打印顺序是什么?(如果不了解js的运行机制就会答错) 正确答案:1 3 2 解析:无论setTimeout的执行时间是0还是1000,结果都是先输出3后输出2,这就是面试官常常

  • javaScript+turn.js实现图书翻页效果实例代码

    javaScript+turn.js实现图书翻页效果实例代码

    为了实现图书翻页的效果我们在网上可以看到很多教程 在这里推荐turn.js 网上的turn.js 有api 不过是英文的  很多人看起来不方便 .关于代码也是奇形怪状在这里我将详细讲解如何使用turn.js实现翻页效果 ,本篇文章只是讲解 turn.js 如何使用!!!!!!! 文章最后提供源码下载,结合源码看本文,turn.js更简单! 首先附上个人的文件路径 对于css   和 js文件不需要过多的解释   在这里要注意的是pages文件夹   这里个文件夹下放的是需要预览的图片文件   

  • JavaScript获取当前运行脚本文件所在目录的方法

    本文实例讲述了JavaScript获取当前运行脚本文件所在目录的方法.分享给大家供大家参考,具体如下: DirectoryUtility = { // function getCurrentDirectory: returns currentDirectory path // with a trailing backslash. getCurrentDirectory : function ( ) { var scriptFullName = WScript.ScriptFullName; va

  • Nginx+SSL+Node.js运行环境配置教程

    Nginx是一款高性能的HTTP服务器,同时也是一款高效的反向代理服务器.不像传统的服务器,Nginx是基于事件驱动的异步架构,内存占用少但是性能很好.如果你的Web应用是基于Node.js的,那么建议你考虑使用Nginx来做反向代理,因为Nginx可以非常高效地提供静态文件服务.本文的主要内容是在不同的操作系统下配置Nginx和SSL,并且搭建一个Node.js运行环境. 安装Nginx 假设你已经在服务器上安装了Node.js,下面我们来安装Nginx. 在Mac系统上安装Nginx 利用c

  • 获取本机IP地址的实例(JavaScript / Node.js)

    --web 客户端JavaScript <!-- 调用方式 --> <body onload="checkCookie()"></body> function getYourIP() { const RTCPeerConnection = window.RTCPeerConnection || window.webkitRTCPeerConnection || window.mozRTCPeerConnection; if (RTCPeerConne

  • Node.js中,在cmd界面,进入退出Node.js运行环境的方法

    在cmd中: 1.输入node回车即可进入Node.js运行环境. 2.退出只需要连续按两次Ctrl+C或者输入".exit"回车即可. 以上这篇Node.js中,在cmd界面,进入退出Node.js运行环境的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们. 您可能感兴趣的文章: nodejs教程之环境安装及运行 配置nodejs环境的方法

  • JavaScript+Node.js写一款markdown解析器

    目录 1. 准备工作 2. 处理图片&超链接 3. 处理blockquote 4. 处理标题 5. 处理字体 6. 处理代码块 7. 处理列表 8. 处理表格 9. 调用方法 1. 准备工作 首先编写getHtml函数,传入markdown文本字符串,这里使用fs读取markdown文件内容,返回值是转换过后的字符串. const fs = require('fs'); const source = fs.readFileSync('./test.md', 'utf-8'); const get

  • 详解javascript new的运行机制

    详解javascript new的运行机制

    和其他高级语言一样javascript 中也有new 运算符,我们知道new 运算符是用来实例化一个类,从而在内存中分配一个实例对象. 但在 javascript 中,万物皆对象,为什么还要通过new 来产生对象? 本文将带你一起来探索 javascript 中 new 的奥秘... 一.认识new运算符 function Animal(name){ this.name = name; } Animal.color = "black"; Animal.prototype.say = f

随机推荐