我们平时使用jQuery大概是这样: let $p = $('p'); $p.css('fontSize', '40px'); 我们生成jQuery实例对象后,就可以使用原型上的css(), html()等方法,这就体现了原型继承:由构造函数生成的实例对象,可以继承构造函数的原型对象上的属性和方法. 我们可以试着手写一个迷你的jQuery,思路大概是这样: 1-通过匿名自执行函数来存放我们的代码,将window对象作为参数传入,防止全局作用域的污染. 2-利用工厂函数,在调用jQuery或者$的…
原型链是js面向对象的基础,非常重要. 一,创建对象的几种方法: 1,字面量 var o1 = { name:'o1' }; 2,构造函数 var M = function(name){ this.name = name; }; var o2 = new M('o2'); var a = {} 其实是 var a = new Object()的语法糖,推荐使用前者 var a = [] 其实是 var a = new Array()的语法糖,推荐使用前者 function Foo(){} 其实是…
原型链理解起来有点绕了,网上资料也是很多,每次晚上睡不着的时候总喜欢在网上找点原型链和闭包的文章看,效果极好. 不要纠结于那一堆术语了,那除了让你脑筋拧成麻花,真的不能帮你什么.简单粗暴点看原型链吧,想点与代码无关的事,比如人.妖以及人妖. 1)人是人他妈生的,妖是妖他妈生的.人和妖都是对象实例,而人他妈和妖他妈就是原型.原型也是对象,叫原型对象. 2)人他妈和人他爸啪啪啪能生出一堆人宝宝.妖他妈和妖他爸啪啪啪能生出一堆妖宝宝,啪啪啪就是构造函数,俗称造人. 3)人他妈会记录啪啪啪的信息,所以可…
在我学习与使用javascript三个月中,我一直对javascript的继承关系以及prototype理解不清,导致很多时候为什么这么用说不出个所以然来.截止到本周为止,通过之前的学习以及自己的再学习,自我感觉算是对这一块有了较为清晰的认识,此文将谈谈我对javascript原型与继承的理解,在此之前,我们首先要知道一些基本的知识.    知识铺垫 1.数据类型 JavaScript中的数据类型在曾经我也有提到过,它包括未定义值(undefined),空值(null),布尔值(boolean)…
.title-bar { width: 80%; height: 35px; padding-left: 35px; color: white; line-height: 35px; font-size: 19px; font-weight: bold; background-color: #2B6695 } 本篇小分享,带有一定车技的新司机上车,老司机我带不动你,你可以带带我.版权归博客园和作者本人共同所有,转载和爬虫请注明原文地址 博客园吴双www.cnblogs.com/tdws 对新司机…
一切皆为对象 殊不知,JavaScript的世界中的对象,追根溯源来自于一个 null 「一切皆为对象」,这句着实是一手好营销,易记,易上口,印象深刻. 万物初生时,一个null对象,凭空而生,接着Object.Function学着null的模样塑造了自己,并且它们彼此之间喜结连理,提供了prototype和constructor,一个给子孙提供了基因,一个则制造万千子子孙孙. 在JavaScript中,null也是作为一个对象存在,基于它继承的子子孙孙,当属对象.乍一看,null像是上帝,而O…
“一切都是对象”这句话的重点在于如何去理解“对象”这个概念. ——当然,也不是所有的都是对象,值类型就不是对象. 首先咱们还是先看看javascript中一个常用的函数——typeof().typeof应该算是咱们的老朋友,还有谁没用过它? typeof函数输出的一共有几种类型,在此列出: function show(x) { console.log(typeof(x)); // undefined console.log(typeof(10)); // number console.log(t…
上文(理解javascript原型和作用域系列(1)——一切都是对象)已经提到,函数就是对象的一种,因为通过instanceof函数可以判断. var fn = function () { }; console.log(fn instanceof Object); // true 对!函数是一种对象,但是函数却不像数组一样——你可以说数组是对象的一种,因为数组就像是对象的一个子集一样.但是函数与对象之间,却不仅仅是一种包含和被包含的关系,函数和对象之间的关系比较复杂,甚至有一点鸡生蛋蛋生鸡的逻辑…
既typeof之后的另一位老朋友! prototype也是我们的老朋友,即使不了解的人,也应该都听过它的大名.如果它还是您的新朋友,我估计您也是javascript的新朋友. 在咱们的第一节(深入理解javascript原型和闭包(1)——一切都是对象)中说道,函数也是一种对象.他也是属性的集合,你也可以对函数进行自定义属性. 不用等咱们去试验,javascript自己就先做了表率,人家就默认的给函数一个属性——prototype.对,每个函数都有一个属性叫做prototype. 这个proto…
注意:本文不是javascript基础教程,如果你没有接触过原型的基本知识,应该先去了解一下,推荐看<javascript高级程序设计(第三版)>第6章:面向对象的程序设计. 上节已经提到,每个函数function都有一个prototype,即原型.这里再加一句话——每个对象都有一个__proto__,可成为隐式原型. 这个__proto__是一个隐藏的属性,javascript不希望开发者用到这个属性值,有的低版本浏览器甚至不支持这个属性值.所以你在Visual Studio 2012这样很…
又介绍一个老朋友——instanceof. 对于值类型,你可以通过typeof判断,string/number/boolean都很清楚,但是typeof在判断到引用类型的时候,返回值只有object/function,你不知道它到底是一个object对象,还是数组,还是new Number等等. 这个时候就需要用到instanceof.例如: 上图中,f1这个对象是被Foo创建,但是“f1 instanceof Object”为什么是true呢? 至于为什么过会儿再说,先把instanceof判…
为何用“继承”为标题,而不用“原型链”? 原型链如果解释清楚了很容易理解,不会与常用的java/C#产生混淆.而“继承”确实常用面向对象语言中最基本的概念,但是java中的继承与javascript中的继承又完全是两回事儿.因此,这里把“继承”着重拿出来,就为了体现这个不同. javascript中的继承是通过原型链来体现的.先看几句代码 以上代码中,f1是Foo函数new出来的对象,f1.a是f1对象的基本属性,f1.b是怎么来的呢?——从Foo.prototype得来,因为f1.__prot…
在Java和C#中,你可以简单的理解class是一个模子,对象就是被这个模子压出来的一批一批月饼(中秋节刚过完).压个啥样,就得是个啥样,不能随便动,动一动就坏了. 而在javascript中,就没有模子了,月饼被换成了面团,你可以捏成自己想要的样子. 首先,对象属性可以随时改动. 对象或者函数,刚开始new出来之后,可能啥属性都没有.但是你可以这会儿加一个,过一会儿在加两个,非常灵活. 在jQuery的源码中,对象被创建时什么属性都没有,都是代码一步一步执行时,一个一个加上的. 其次,如果继承…
什么是“执行上下文”(也叫做“执行上下文环境”)?暂且不下定义,先看一段代码: 第一句报错,a未定义,很正常.第二句.第三句输出都是undefined,说明浏览器在执行console.log(a)时,已经知道了a是undefined,但却不知道a是10(第三句中). 在一段js代码拿过来真正一句一句运行之前,浏览器已经做了一些“准备工作”,其中就包括对变量的声明,而不是赋值.变量赋值是在赋值语句执行的时候进行的.可用下图模拟: 这是第一种情况. 下面还有.先来个简单的. 有js开发经验的朋友应该…
继续上一篇文章(http://www.cnblogs.com/wangfupeng1988/p/3986420.html)的内容. 上一篇我们讲到在全局环境下的代码段中,执行上下文环境中有如何数据: 变量.函数表达式——变量声明,默认赋值为undefined: this——赋值: 函数声明——赋值: 如果在函数中,除了以上数据之外,还会有其他数据.先看以下代码: 以上代码展示了在函数体的语句执行之前,arguments变量和函数的参数都已经被赋值.从这里可以看出,函数每被调用一次,都会产生一个新…
接着上一节讲的话,应该轮到“执行上下文栈”了,但是这里不得不插入一节,把this说一下.因为this很重要,js的面试题如果不出几个与this有关的,那出题者都不合格. 其实,this的取值,分四种情况.我们来挨个看一下. 在此再强调一遍一个非常重要的知识点:在函数中this到底取何值,是在函数真正被调用执行的时候确定的,函数定义的时候确定不了.因为this的取值是执行上下文环境的一部分,每次调用函数,都会产生一个新的执行上下文环境. 情况1:构造函数 所谓构造函数就是用来new对象的函数.其实…
继续上文的内容. 执行全局代码时,会产生一个执行上下文环境,每次调用函数都又会产生执行上下文环境.当函数调用完成时,这个上下文环境以及其中的数据都会被消除,再重新回到全局上下文环境.处于活动状态的执行上下文环境只有一个. 其实这是一个压栈出栈的过程——执行上下文栈.如下图: 可根据以下代码来详细介绍上下文栈的压栈.出栈过程. 如上代码. 在执行代码之前,首先将创建全局上下文环境. 然后是代码执行.代码执行到第12行之前,上下文环境中的变量都在执行过程中被赋值. 执行到第13行,调用bar函数.…
提到作用域,有一句话大家(有js开发经验者)可能比较熟悉:“javascript没有块级作用域”.所谓“块”,就是大括号“{}”中间的语句.例如if语句: 再比如for语句: 所以,我们在编写代码的时候,不要在“块”里面声明变量,要在代码的一开始就声明好了.以避免发生歧义.如: 其实,你光知道“javascript没有块级作用域”是完全不够的,你需要知道的是——javascript除了全局作用域之外,只有函数可以创建的作用域. 所以,我们在声明变量时,全局代码要在代码前端声明,函数中要在函数体一…
上文简单介绍了作用域,本文把作用域和上下文环境结合起来说一下,会理解的更深一些. 如上图,我们在上文中已经介绍了,除了全局作用域之外,每个函数都会创建自己的作用域,作用域在函数定义时就已经确定了.而不是在函数调用时确定. 下面我们将按照程序执行的顺序,一步一步把各个上下文环境加上.另外,对上下文环境不了解的朋友,可以去看看之前的两篇文章: http://www.cnblogs.com/wangfupeng1988/p/3986420.html http://www.cnblogs.com/wan…
先解释一下什么是“自由变量”. 在A作用域中使用的变量x,却没有在A作用域中声明(即在其他作用域中声明的),对于A作用域来说,x就是一个自由变量.如下图 如上程序中,在调用fn()函数时,函数体中第6行.取b的值就直接可以在fn作用域中取,因为b就是在这里定义的.而取x的值时,就需要到另一个作用域中取.到哪个作用域中取呢? 有人说过要到父作用域中取,其实有时候这种解释会产生歧义.例如: 所以,不要在用以上说法了.相比而言,用这句话描述会更加贴切——要到创建这个函数的那个作用域中取值——是“创建”…