概述 这是我看<你不知道的JavaScript(中卷)>中关于类型检查的笔记,供以后开发时参考,相信对其他人也有用. typeof 我们知道js中有七种内置类型:undefined, null, string, boolean, object, number, symbol. 我们分别用typeof对它们一一进行检查: typeof void(0) //输出'undefined' typeof null //输出'object' typeof 'haha' //输出'string' typeo…
近几天看了一本不错的 JavaScript 的书,是 Kyle Simpson 写的 <You Don't know JS>.这本书是 Kyle Simpson 在 Github 上的开源项目,截止到现在已经有 27,796 个 star .本想看英文版本,不料在某东上看到了中文版,于是乎就买下了.结果,翻译得还不错,推荐. 原著github地址 ,某东链接自行搜索呵呵. 这本书属于JavaScript开发者的进阶读物,原著至今为止已经出了6本,中文版(上卷)涵盖了其中的两本,介绍了4个知识点…
处理程序三要素: 引擎:编译与执行过程. 编译器:语法分析与代码生成等. 作用域:收集并维护由所有声明的标识符(变量)组成的一系列查询,并实施一套非常严格的规则,确定当前执行的代码对这些标识符的访问权限. 示例: var a=2;的解析过程: 1.编译器 询问 作用域 是否已经有该名称的变量 是:忽略该声明,继续执行: 否:声明一个新变量,命名为a; 2.编译器为引擎生成代码 引擎运行首先询问作用域,在当前作用域集合中是否存在一个a的变量: 是:引擎会使用这个变量; 否:引擎继续查找该变量; 找…
你不知道的JavaScript上卷笔记 前言 You don't know JavaScript是github上一个系列文章   初看到这一标题的时候,感觉怎么老外也搞标题党,用这种冲突性比较强的题目吸引眼球,以致最初真没去看内容.直到出了中文版<你不知道的JavaScript>,一看评价大家都说好,买来一读,内容果然很好,很多地方,让我这个半路转行JavaScript的人豁然开朗.中文版现在出了上卷,中卷应该很快会推出,下卷就要等久一点了 作用域和闭包 作用域是什么 1.现代JavaScri…
你不知道的Javascript(上卷)这本书在我看来是一本还不错的书籍,这本书用比较简洁的语言来描述Js的那些"坑",在这里写一些博客记录一下笔记以便消化吸收. 1 编译原理 在此书中,开始便提出:Javascript是一门编译型语言,我一开始以为这是国内翻译的锅,翻译的不够准确,后来我还专门去github看了,作者确实是将Js描述为一门编译型语言(compiled language).然而我认为作者更想表达的是Js也拥有和Java一般的特定的编译过程.而不是传统得认为只是单纯的进行&…
在写这篇博客时这本书我已经是看过一遍了,为了加深印象和深入学习于是打算做这系列的前端经典书籍导读博文,大家如果觉得这本书讲的好可以自己买来看看,我是比较喜欢看纸质版书的,因为这样才有读书的那种感觉. 本期我给大家讲述的是     前端经典js书籍   <<你不知道的javaScript(上卷)>> 第一章内容的知识点总结和讲解. 1.1 编译原理 尽管通常将js归类为"动态"或"解释执行"语言,但事实上它是一门编译语言.但与传统的编译语言不同…
一.编译过程 常见编译性语言,在程序代码执行之前会经历三个步骤,称为编译. 步骤一:分词或者词法分析 将由字符组成的字符串分解成有意义的代码块,这些代码块被称为词法单元. 例子:  var a = 2; 这一句通常被分解成为下面这些词法单元:var .a . = .2.; .   步骤二:解析或者语法分析 将词法单元流(数组)转换成一个由元素逐级嵌套所组成的代表了程序语法结构的树.这个树被称为“抽象语法树”(Abstract Syntax Tree, AST) 例子: var .a . = .2…
用了一个星期把<你不知道的JavaScript>看完了,但是留下了很多疑惑,于是又带着这些疑惑回头看JavaScript的内容,略有所获. 第二遍阅读这本书,希望自己能够有更为深刻的理解. 词法作用域 --如果是 有状态 的解析过程,还会赋予单词语义-- 这本书是以编译原理的部份内容结合JavaScript来开篇的,所以如果没有学过编译原理,这一小部分内容显得有些晦涩. 虽然多数人没有接触过编译原理,但有一个东西必定知道,就是markdown语法.实际上,从markdown文件到HTML的过程…
console.log( a ); var a = 2; 执行输出undefined a = 2; var a; console.log( a ); 执行输出2 说明:javaScript 运行时在编译器阶段会最先处理var a;也就是变量被提升 foo(); function foo() { console.log( a ); // undefined var a = 2; var a = 2; } 执行输出undefined,执行foo();时找到了函数的声明,但实际代码写在foo()的后面…
由于自己在对数组操作这块比较薄弱,然后经高人指点,需要好好的攻读一下这本书籍,原本想这个书名就比较高深,这下不好玩了.不过看着看着突然觉得讲的东西都比较基础.不过很多东西,平时还是没有注意到,故写出读书笔记和诸君共勉! 第二张 2.2.1 创建一个数组 创建数组的方式有?那种比较高效?原因是? 第一种模式 var nums = []; var numbers = [1,2,3,4,5];console.log(numbers.length)//5 第二种模式 var nums = new Arr…
第一章 作用域 1.理解作用域 几个名词的介绍 引擎:从头到尾负责整个JavaScript程序的编译及执行过程 编译器:负责语法分析及代码生成器等脏活累活 作用域:负责收集并维护由所有声明的标识符(变量)组成的一系列查询,并实施一套非常严格的规则,确定当前执行的代码对这些标识符的访问权限. 对var a = 2;进行分解,了解引擎等是如何工作. 编译器首先将这段程序分解成词法单元,然后将词法单元解析成一个树结构.但是当编译器开始进行代码生成时,它对这段程序的处理方式会和预期的有所不同. 编译器会…
1.ECMAScript数据类型分为:基本类型值和引用类型值: ECMAScript中所有函数的参数都是按值传递的: 检查对象的类型:varible instanceof constructor Alert(person instanceof Object); 2.  执行环境和变量 每个执行环境都有一个与之关联的变量对象,环境中定义的所有变量和函数都保存在这个对象中: 全局执行环境是最外围的一个指定环境,在web浏览器中,全局执行环境是window对象,所有的全局变量和函数都是window对象…
一.什么是词法作用域? 词法作用域是在定义词法阶段的作用域,就是由代码变量和作用域块写在哪里决定的,基本上词法分析器在处理代码时会保持作用域不变. 二.词法作用域特点 完全由写代码期间函数所声明的位置来定义 词法作用域查找只查找一级标志符(foo.bar.baz,只试图查找foo标志符) 三.如何运行时修改词法作用域? eval() function foo(str,a){ eval(str) //会修改foo函数的词法作用域 console.log(a,b)}var b = 2;foo('va…
高性能的JavaScript 一.      加载和运行 将脚本放在底部 脚本下载解析执行时,页面已经加载完成并显示在用户面前 成组脚本 减少外部脚本文件数量,整合成一个文件 延迟脚本 动态脚本元素 非阻塞方式 XMLHttpRequest var xhr = new XMLHttpRequest(); xhr.open("get", "file.js", true); xhr.onreadystatechange = function() { if(xhr.rea…
零.组织结构 根据引言,作者将全书划分为四个部分: 一.页面加载js的最佳方式(开发前准备) 二.改善js代码的编程技巧(开发中) 三.构建与部署(发布) 四.发布后性能检测与问题追踪(线上问题优化) 这样的组织结构也符合我们的开发习惯,首先进入第一部分. 一.JavaScript加载 起因:script脚本的加载会阻塞浏览器渲染页面和处理用户交互,如果加载的script脚本太多太大,就会长时间阻塞,造成页面假死. 解决方案: 1.脚本位置 放在底部. 放在底部可以保证页面主体结构已经基本加载完…
编译原理 JavaScript事实上是一门编译语言,但与传统的编译语言不同,它不是提前编译的,编译结果也不能在分布式系统中进行移植. 任何JavaScript代码片段在执行前都要进行编译(通常就在执行前). 在传统编译语言的流程中,程序中的一段源代码在执行之前会经历三个步骤,统称为“”编译“”. 1.分词/词法分析(Tokenizing/Lexing) 将由字符组成的字符串分解成(对编程语言来说)有意义的代码块,这些代码块被称为词法单元. 分词(tokenizing)和词法分析(lexing)之…
1.  严格模式:在javascript中定义了一种不同的解析与执行模型.在严格模式下,一些不确定的行为将得到处理,对某些不安全的操作也会抛出错误. 用法是在脚本中添加:”use strict”; 这是一个编译指示,用于告诉引擎切换到严格模式: 2.  Javascript中的语句,若没有带分号,由解析器确定语句的结尾,但不推荐这么做: Javascript关键字: break,case,catch,continue,debugger*,default,delete,do,else,finall…
从今天开启每天看书记笔记模式,<JavaScript高级程序设计(第3版)> 1. Javascript最初是为了解决输入验证器的问题,现在已经发展成一门复杂的语言: 2.  语言标准为ECMAScript(ek-ma-script),一个完整的Javascript有三部分组成: 核心(ECMAScript).文档对象模型(DOM).浏览器对象模型(BOM) (1)       ECMAScript规定了Javascript语言的组成部分:语法.类型.语句.关键字.保留字.操作符.对象: EC…
第一部分 作用域与闭包 第一章 作用域是什么 1.作用域 变量赋值操作会执行两个动作:首先编译器会在当前作用域中声明一个变量(如果之前没有声明过), 然后会在运行时引擎会在作用域中查找该变量,找到就会对他赋值. 2.理解LHS和RHS操作赋值 简单来说  LHS:查找的目的是进行变量赋值,使用LHS查询[存] RHS:目的是获取变量的值,就会用RHS[取] 3.JavaScript编译原理   例如var a=2会被拆分为 var a在其作用域中声名新变量:a = 2会查询变量a并且对它赋值 4…
一.创建一个对象的语法 var myObj = { key: value // ... };//字面量 var myObj = new Object(); //new myObj.key = value; 二.js中的内置对象 String,Number,Boolean,Object,Function,Array,Date,RegExp,Error 在使用string 等创建的字面量形式时,js会隐试转换成其对应的内置对象,null 和 undefined没有对应的构造形式,Date 只有构造,…
function foo() { console.log( a ); } function bar() { var a = 3; foo(); } var a = 2; bar(); 上面这段代码为什么会输出2,而不是3?因为javaScript 只有词法作用域,foo()的定义在全局作用域,执行时会在它所在词法作用域查找变量a this 的作用域 function foo() { var a = 2; this.bar(); console.log(this) } function bar()…
什么是闭包 闭包是javaScript语言的一种特性,在 javaScript 中以函数作为承接单元.当函数可以记住并访问所在的词法作用域时,就产生了闭包,即使函数是在当前词法作用域之外执行. function foo() { var a = 2; function bar() { console.log( a ); } bar(); } foo(); bar() 产生了闭包,但是由于它内嵌在foo函数里面执行,bar中对a的引用遵循了词法作用域的查找规则,其实也是闭包查询规则的一部分. fun…
一.什么是作用域? 作用域是用来存储变量以及方便寻找变量的一套规则. 二.javaScript 编译过程(编译发生在代码执行前的几微妙) 分词/词法分析(Tokenizing/Lexing)->词法单元 解析/语法分析(paring)-> AST 对运行性能进行优化 代码生成 -> 机器指令,创建变量分配内存等操作 三.从 var a = 2:理解 javaScript 的工作原理 编译器将var a = 2:分解成词法单元,然后解析成AST抽象语法树: 编译器查找作用域中是否已经有a这…
自动类型转换 在JavaScript中,使用 == .=== 和 - 等运算符能够使得类型自动转换. 关于不同类型的值的比较 flase == 0; //true "" == flase; //true "1" == 1; //true "0" == false; //true null == false; //flase undefined == false; //false undefined == null; //true null ==…
1.undefined,null,0,""  这四个值转换为逻辑值时是false,其他无论简单类型值,对象或者函数转换过来都是true 2.如图 第一个是“声明了一个变量,给变量赋值(赋的是一个函数),然后又更改了变量的值(同样也是因为变量是以值保存,而不是对象那种以引用保存的方式) 第二个是”声明了一个函数,定义里里面的规则,然后把这个名字的函数又声明了一遍,定义了不同的规则“ 造成第二个alert成这样的原因是,一段程序执行的时候,会先把定义语句抓出来先执行,完了才去执行其他代码,…
写在前面:之前硬着头皮参加了java方面的编程规范培训,收货良多,工作半年有余的时候,总算感觉到一丝丝Coding之美,以及造轮子的乐趣,以至于后面开发新功能的时候,在Coding style方面花了很多时间,但还有一些细节方面,总感觉一直没有统一,比如什么时候该加空行,比如是不是所有的return前面都应该加个空行以及注释的添加等等,才有了对这本书<编写可维护的Javascript>的阅读,还是如之前一样,只收纳了一些自己看本书的时候,还未完全贯彻的style 有待改进的点:在前端自动化的路…
Function类型 ECMAScript中函数是对象,每个函数都是Function类型的实例,也有属性和方法,函数是对象,函数名实际上市一个指向函数对象的指针,不会与某个函数绑定: function sum(num1,num2){ return num1+num2; } 同: var sum=function(num1,num2){ return num1+num2; }; (1)没有重载 若声明了两个同名函数,后面的函数会覆盖前面的函数: (2)函数声明和函数表达式 解析器会率先读取函数声明…
1.Array类型 ECMAScript数组的每一项可以保存任何类型的数据,数组的大小也可以动态调整: (1) 创建数组 第一种方式:Array构造函数 var colors=new Array(); var colors1=new Array(20); var colors2=new Array("rad","blue","green"); var colors3=Array(3); var colors4=Array("Greg&q…
1.  操作符 (1)       一元操作符 前置递增和递减操作符,变量的值都是在语句被求值以前改变的:后置相反 (2)       位操作符 在ECMAScript中,对数值进行位操作时,会发生以下转换过程:64位的数值被转换为32位数值,然后执行位操作,最后再将32位的结果转换回64位数值: 右移分为有符号右移(>>)和无符号右移(>>>) (3)       布尔操作符-(!)(&&)(||) (4)       全等操作符(===)只在两个操作数未经…
[[Prototype]]机制 [[Prototype]]是对象内部的隐试属性,指向一个内部的链接,这个链接的作用是:如果在对象上没有找到需要的属性或者方法引用,引擎就 会继续在 [[Prototype]] 关联的对象上进行查找.同理,如果在后者中也没有找到需要的 引用就会继续查找它的 [[Prototype]],以此类推.这一系列对象的链接被称为“原型链”. function Foo() { // ... } var a = new Foo(); Object.getPrototypeOf(…