随笔分类 - javascript
javascript
理解Javascript_13_执行模型详解
摘要:在《理解Javascript_12_执行模型浅析》一文中,我们初步的了解了执行上下文与作用域的概念,那么这一篇将深入分析执行上下文的构建过程,了解执行上下文、函数对象、作用域三者之间的关系。函数执行环境简单的代码:当调用say方法时,第一步是创建其执行环境,在创建执行环境的过程中,会按照定义的先后顺序完成一系列操作:1.首先会创建一个'活动对象'(Activation Object)。活动对象是规...
阅读全文
理解Javascript_15_作用域分配与变量访问规则,再送个闭包
摘要:在阅读本博文之前,请先阅读《理解Javascript_13_执行模型详解》在'执行模型详解'中讲到了关于作用域分配的问题,这一篇博文将详细的说明函数对象、作用域链与执行上下文的关系。作用域分配与变量访问规则 在 ECMAScript 中,函数也是对象。函数对象在变量实例化过程中会根据函数声明来创建,或者是在计算函数表达式或调用 Function 构造函数时创建。(关于'函数对象'请见《理解Jav...
阅读全文
理解Javascript_14_函数形式参数与arguments
摘要:在'执行模型详解'的'函数执行环境'一节中对arguments有了些许的了解,那么让我们深入的分析一下函数的形式参数与arguments的关系。注:在阅读本博文前请先阅读《理解javascript_13_执行模型详解》注:本文的部分内容是自已的一些推论,并无官文文档作依据,如有错误之后,还望指正。生涩的代码我们先来看一段比较生涩的代码: 你能正确的解释代码的执行结果吗?思考一下. 我想代码运行...
阅读全文
超越Jquery_01_isPlainObject分析与重构
摘要:isPlainObject是Jquery1.4后提供的新方法,用于判断对象是否是纯粹的对象(通过 "{}" 或者 "new Object" 创建的)。使用isPlainObject 首先我们来了解一下什么叫'纯粹的对象',简单的理解'纯粹的对象'指的就是由Object构造出来的对象。那哪些对象是由Object构造出来的呢。首当其充的肯定是由new Object()所构造出来的对象,注意:在Obj...
阅读全文
理解Javascript_12_执行模型浅析
摘要:大家有没有想过,一段javascript脚本从载入浏览器到显示执行都经过了哪些流程,其执行次序又是如何。本篇博文将引出'javascript执行模型'的概念,并带领大家理解javascript在执行时的处理机制。简单的开始简单的代码:上面代码段的运行顺序是:对于step1中的'脚本段'指的是<script>... ...</script>标签中的内容,还包括外部引入的脚本文...
阅读全文
理解Javascript_11_constructor实现原理
摘要:在理解了'对象模型'后,我们就可以看一下constructor属性是如何实现的.constructor是什么简单的理解,constructor指的就是对象的构造函数。请看如下示例:对于foo.constructor为Foo,我想应该很好理解,因为foo的构造函数为Foo。对于Foo、Object、Function的构造函数为Function,我想也没什么好争议的。(因为Foo,Object,Fun...
阅读全文
理解Javascript_10_对象模型
摘要:什么都不想说,一段代码两张图,解释一切。注:在此之前请阅读前面的系列博文对象模型图片来自于:http://www.cnblogs.com/riccc红色虚线表示隐式Prototype链。这张对象模型图中包含了太多东西,不少地方需要仔细体会,可以写些测试代码进行验证。彻底理解了这张图,对JavaScript语言的了解也就差不多了。下面是一些补充说明:1. 图中有好几个地方提到build-in Fun...
阅读全文
理解Javascript_09_Function与Object
摘要:在《理解Javascript_08_函数对象》中讲解了很多函数对象的问题,同时也留下了许多疑问,今天让我们来解答部分问题。注:理论过于深入,本人不改保证所有的理论都是正确的,但经过多方测试还未发现实际代码与理论冲突的问题。如有错误,望高人指点!Function 首先回顾一下函数对象的概念,函数就是对象,代表函数的对象就是函数对象。所有的函数对象是被Function这个函数对象构造出来的。也就是说...
阅读全文
理解Javascript_08_函数对象
摘要:如果你无法理解博文在讲什么,请回顾前面的系列博文。文章比较深入,如有不对之处,望请指正,谢谢。函数对象首先,大家得明确一个概念:函数就是对象,代表函数的对象就是函数对象。既然是对象,那它又是被谁构造出来的呢?下面我们来看一段描述:JavaScript代码中定义函数,或者调用Function创建函数时,最终都会以类似这样的形式调用Function函数:var newFun=Function(funA...
阅读全文
理解Javascript_07_理解instanceof实现原理
摘要:在《Javascript类型检测》一文中讲到了用instanceof来用做检测类型,让我们来回顾一下:那么instanceof的这种行为到底是如何实现的呢,现在让我们揭开instanceof背后的迷雾。instanceof原理照惯例,我们先来看一段代码:让我们画一张内存图来分析一下:内存图比较复杂,解释一下:程序本身是一个动态的概念,随着程序的执行,Dog.prototype会不断的改变。但是为了...
阅读全文
理解Javascript_06_理解对象的创建过程
摘要:在《理解Javascript_05_原型继承原理》一文中已经详细的讲解了原型链的实现原理,大家都知道原型链是基于对象创建的(没有对象,哪来原型),那么今天就来解析一下对象的创建过程。简单的代码我们先来看一段简单的代码: 复杂的理论JS中只有函数对象(函数)具备类的概念,因此创建一个对象,必须使用函数对象。函数对象内部有[[Construct]]方法和[[Call]]方法,[[Construct]...
阅读全文
理解Javascript_05_原型继承原理
摘要:对于面向对象的基础语法在此我就不重复了,对面向对象不熟悉的朋友可以参看《使用面向对象的技术创建高级 Web 应用程序》一文。prototype与[[prototype]]在有面象对象基础的前提下,来看一段代码:其对应的简易内存分配结构图:现在让我们来解释一下这张内存图的来龙去脉:首先明确一点[[prototype]]与prototype并不是同一个东西。 那先来看prototype,每一个函数对...
阅读全文
理解Javascript_04_数据模型
摘要:本文主要描述Javascript的数据模型,即对Javascript所支持的数据类型的一个全局概缆。文章比较的理论化,非常深入,因此不易理解,但务必对数据模型有一个映象,因为他是理解Javascript对象模型与Javascript执行模型的基础。基本的数据类型原始类型(简单数据类型、基本数据类型)Undefined类型:表示声明了变量但未对其初始化时赋予该变量的值。undefined为Undef...
阅读全文
Javascript提速_01_引用变量优化
摘要:说明:为了文章的系统性,将本博文原来的两节内容放到了单独的一篇中,请见:《理解Javascript_12_执行模型浅析》引用变量优化即然我们已经了解了Javascript中变量的访问规则,那我们就来具体分析一下上面代码中alert(document.body.tagName);这一句的具体执行流程:由此可见,要在Fn2中访问window对象下的document对象的body属性的tagName属性...
阅读全文
伪数组
摘要:这篇文章来回答javascript通用循环遍历方法forEach中最后提到的关于伪数组的问题。什么是伪数组能通过Array.prototype.slice转换为真正的数组的带有length属性的对象。这种对象有很多,比较特别的是arguments对象,还有像调用getElementsByTagName,document.childNodes之类的,它们都返回NodeList对象都属于伪数组。我们可...
阅读全文
javascript通用循环遍历方法forEach
摘要:上一次的错误太多,排版也出现了问题,重写了一遍,希望大家支持.循环遍历一个元素是开发中最常见的需求之一,那么让我们来看一个由框架BASE2和Jquery的结合版本吧.函数本身并不复杂,但很精巧。加了一些简单的注释,想信大家能看懂。来看一点例子注:回调函数中的index参数下标从1开始为什么不用内置的forEach和getElementsByClassName一样,内置的forEach效率很高,但是...
阅读全文
我的getElementsByClassName实现
摘要:先来看一下代码:(支持多个class查询和在某个范围内进行查询)好,我们来测试一下:正确的得到了结果。关于class属性1.一个元素可以带有多个class属性值,它们通过空格分隔, 例:class='aa bb cc'。2.class属性值是可以包含'-'这个字符的,如:class='a-b',特别强调是因为在正则表达式中'-'是一个特殊字符。3.在javascript中通过的获取class属性值...
阅读全文
理解Javascript_03_javascript全局观
摘要:今天让我们站在语言的高度来看一下Javascript都有点什么。因为是全局性的俯瞰,所以不针对细节作详细的讲解。先来看一张图吧:解释一下:核心(ECMAScript):定义了脚本语言的所有对象,属性和方法文档对象模型(DOM):HTML和XML应用程序接口浏览器对象模型(BOM):对浏览器窗口进行访问操作现在来具体的讲一个各个成分:关于ECMAScriptECMAScript的工作是定义语法和对象...
阅读全文
理解Javascript_02_理解undefined和null
摘要:来自普遍的回答:其实在 ECMAScript 的原始类型中,是有Undefined 和 Null 类型的。 这两种类型都分别对应了属于自己的唯一专用值,即undefined 和 null。 值 undefined 实际上是从值 null 派生来的,因此 ECMAScript 把它们定义为相等的,通过下列代码可以验证这一结论: alert(undefined == null); //true尽管这两...
阅读全文
理解Javascript_01_理解内存分配
摘要:在正式开始之前,我想先说两句,理解javascript系列博文是通过带领大家分析javascript执行时的内存分配情况,来解释javascript原理,具体会涵盖javascript预加载,闭包原理,面象对象,执行模型,对象模型...,文章的视角很特别,也非常深入,希望大家能接受这种形式,并提供宝贵意见。原始值和引用值在ECMAScript中,变量可以存放两种类型的值,即原始值和引用值。原始值指...
阅读全文