JS代码从编译到执行

  我们写出一段JS代码,JS的引擎并不是按照我们书写的顺序从上到下顺序编译并且执行的,首先是按照自己的规则对我们的代码先进行编译,然后从上到下执行编译的代码。

  在全局作用域中,JS首先会对我们的函数进行声明,然后就是我们经常听到的变量提升机制,然后才是按照我们书写代码的顺序,来进行编译,然后在执行编译的代码。

  看如下代码:

function fn(){
console.log(a);
}
fn();
var a = "value";

  非常常见的一个面试题fn函数执行输出undefined,我们按照上面说的JS编译执行的机制来模拟编译后的代码:

function fn(){
console.log(a);
}
var a = undefined;
fn();
a = "value";

  然后按照编译出来的顺序自上而下的来执行我们的代码,可以看出当fn函数执行时a还没有进行赋值,此时的a为undefined。

  在函数作用域中的编译顺序为:首先对函数的存在的参数进行声明,然后是内部的函数,在然后是变量,然后在顺序编译我们书写的代码,假如有如下的代码:

function wrap(a,b){
var c = "c";
var str = a+b+c;
function pirint(){
console.log(str)
}
print();
}
wrap("a","b");

  很标准的一段代码,wrap函数内部模拟编译的代码为:

var a = undefind;
a = "a";
var b = undefined;
b = "b";
function _print(){
console.log(str);
}
var c = undefined;
var str = undefined;
c = "c";
str = a+b+c;
_print();

  弄清JS的执行机制可能并不会让我书写数功能更加强大的代码,但是可以让我们写出更加优雅的代码,其次在做一些笔试题的时候也可以让我们更加的得心应手,在高的墙都是由一块块砖一粒粒细沙垒成的,代码也是一样在复杂的代码也都是以基础的代码作为根基的。

JS基本使用

  代码无论怎么写,基础的知识都是不变的。

  1."."操作符的左边永远是一个对象,右边就是属性(属性值也有可能还是一个对象),结果就是这个属性的属性值。

  2."()"永远都是对一个方法的调用。

  3."()"里面永远都是参数,如果里面的参数是一个表达式,则先执行表达式,然后将表达式执行的结果作为参数。

  例如我们经常使用的JQ的链式操作:$("#demo").html().css();$、html、css都是一个方法名字,而每一个方法都会返回一个对象,从而来实现方便我们开发的链式操作。

JS代码执行机制的更多相关文章

  1. 试着讲清楚:js代码运行机制

    一. js运行机制 js执行引擎 经常看文章的说到js是带线程的,其实这个说法非常的模糊,准确的是js执行引擎是单线程的,js执行引擎就是js代码的执行器,有了这个概念就可以下来说说js是如何运行的了 ...

  2. 浅析JS异步执行机制

    前言 JS异步执行机制具有非常重要的地位,尤其体现在回调函数和事件等方面.本文将针对JS异步执行机制进行一个简单的分析. 从一份代码讲起 下面是两个经典的JS定时执行函数,这两个函数的区别相信对JS有 ...

  3. 深入理解 JS 引擎执行机制(同步执行、异步执行以及同步中的异步执行)

    首先明确两点: 1.JS 执行机制是单线程. 2.JS的Event loop是JS的执行机制,深入了解Event loop,就等于深入了解JS引擎的执行. 单线程执行带来什么问题? 在JS执行中都是单 ...

  4. JS 引擎执行机制

    JS JS 是单线程语音 JS 的 Event Loop 是 JS 的执行机制.类似于 Android Handler 消息分发机制 JS 单线程 技术的出现都跟现实世界里的应用场景密切相关 JS 单 ...

  5. js代码执行顺序问题

      前  言 LiuDaP 今天就给大家介绍一个特别基础的东西,javascript中函数的一点儿小知识(js代码的执行顺序),希望对大家有那么一点点帮助吧!!! 一.js--->单线程 严格意 ...

  6. [js]js代码执行顺序/全局&私有变量/作用域链/闭包

    js代码执行顺序/全局&私有变量/作用域链 <script> /* 浏览器提供全局作用域(js执行环境)(栈内存) --> 1,预解释(仅带var的可以): 声明+定义 1. ...

  7. xss 防止攻击,恶意用户将输入的信息当成html或js代码执行,办法是将用户输入的信息改为text格式,或特殊符号转义

    xss 防止攻击,恶意用户将输入的信息当成html或js代码执行,办法是将用户输入的信息改为text格式,或特殊符号转义 XSS攻击的防范 XSS攻击造成的危害之所以会发生,是因为用户的输入变成了可执 ...

  8. Java虚拟机JVM内存分区及代码执行机制

    详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcyt230 1.  JVM体系结构 图1 JVM体系结构    方法区:存放JVM ...

  9. 关于js代码执行顺序

    上网查了一下关于这个方面的资料,大部分都是关于两个script标签中的js代码和变量以及函数提升方面的知识. 1.两个script标签 <script> alert("我是代码块 ...

随机推荐

  1. 理解Java异常处理机制的机理

    重看异常机制的时候觉得抓到了点机理上的精髓,所以来说一下,对初学者应该会有些帮助   JAVA中的异常机制 从机制上由[产生异常][抛出异常][捕捉异常][异常处理]组成 从形式上又分为四种: 运行时 ...

  2. format的用法:python

    https://www.cnblogs.com/wongbingming/p/6848701.html 它通过{}和:来代替%.通过位置 In [1]: '{0},{1}'.format('kzc', ...

  3. mysql 数据操作 单表查询 where约束 between and or

    WHERE约束 where字句中可以使用: 比较运算符:>< >=  <=  != between 80 and 100 值在80到100之间   >=80  <= ...

  4. CSV文件读取类

    最近项目中,经常需要读取Csv文件.基本步骤是: (1)按行读取 (2)然后将一行数据按逗号,分割为字符串数组 (3)将各列字符串转换成相应类型的数据 ,如int double类型 写了一个简单的Cs ...

  5. jmeter -xml日志格式中网络时间与服务器时间的区分

    在 LR 中是有一个“网页细分图”的,通过这个图,你可以比较容易的区分哪些请求的响应时间最长,如果响应时间过程,是消耗在server处理的时候,还是消耗在网络传输过程中——也就是所谓的 Server ...

  6. python pytz 结合时区的日期操作

    有一个安排在2012 年12 月21 日早上9:30 的电话会议,地点在芝加哥.而朋友在印度的班加罗尔,那么他应该在当地时间几点参加这个会议呢? 对几乎所有涉及到时区的问题,你都应该使用pytz 模块 ...

  7. 【运维技术】CentOS7上从零开始安装LAMP安装织梦DedeCMS教程

    前期准备数据 centos7 系统 安装 appache httpd # 更新httpd yum update httpd # 安装httpd yum install -y httpd # 启动服务 ...

  8. office 2010 安装时出错 MSXML版本6.10.1129.0

    微软下载网址:https://www.microsoft.com/zh-cn/download/details.aspx?id=6276&751be11f-ede8-5a0c-058c-2ee ...

  9. 来自MSDN的RibbonGadgets练习

    来自MSDN的RibbonGadgets练习 RibbonGadgets是少见的来自官方的资源. 如果选择Menu Items = 集合,则会有向下的小箭头,同时会出现下来菜单. 这个都关系叫做gal ...

  10. Android 旋转、平移、缩放和透明度渐变的补间动画

    补间动画就是通过对场景里的对象不断进行图像变化来产生动画效果.在实现补间动画时,只需要定义开始和结束的“关键帧”,其他过渡帧由系统自动计算并补齐.在Android中,提供了以下4种补间动画. **1. ...