JS-原型的某些概念

2.js原型的基本概念

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" con…

在刚刚接触JS原型链的时候都会接触到一个熟悉的名词:prototype:如果你曾经深入过prototype,你会接触到另一个名词:__proto__(注意:两边各有两条下划线,不是一条).以下将会围绕prototype和__proto__这两个名词解释为什么不能在原型链上使用对象以及JS原型链的深层原理. 一.为什么不能在原型链上使用对象: 先举一个非常简单的例子,我有一个类叫Humans(人类),然后我有一个对象叫Tom(一个人)和另一个对象叫Merry(另一个人),很明显Tom和Merry都…

JS 原型链

之前对JS的prototype知识比较模糊,今天理清了记下来,以防忘记,直切正题: 1.要明白原型链,就必须先清楚JS的构造函数模式: js是面向对象的语言,既然是面型对象,就一定会有一个对象的模板,Java中用"类"来作为对象的模板,而JS中,可以用构造函数来作为对象的模板,你可以认为相当于Java中的"类", 写法如下所示: function Cat(name,color){ this.name=name; this.color=color; } var c =…

js原型

1.js基本类型和对象类型 js的简单类型包括数字(其中NaN为数字类型).字符串(类似'A'为字符,js没字符类型).布尔值.null值和undefined值.其他所有的值都是对象.数字.字符串和布尔值“貌似”是对象,因为它们拥有方法,但它们是不可变的,所以不是对象.js的对象时可变的键控集合(keyed collections).在js中,数组.函数.正则表达式是对象. 2.js原型的重要知识点首先要知道一个很重要的知识点,一句话:所有对象都有原型对象. 3.对比其他语言的理解原型对象,…

JS 原型链图形详解

JS原型链这篇文章是「深入ECMA-262-3」系列的一个概览和摘要.每个部分都包含了对应章节的链接,所以你可以阅读它们以便对其有更深的理解. 对象 ECMAScript做为一个高度抽象的面向对象语言,是通过对象来交互的.即使ECMAScript里边也有基本类型,但是,当需要的时候,它们也会被转换成对象. 一个对象就是一个属性集合,并拥有一个独立的prototype(原型)对象.这个prototype可以是一个对象或者null.* 让我们看一个关于对象的基本例子.一个对象的prototype是…

js原型解析

我们都知道javascript因为具有了继承以及变量等等一系列的特性之后才被人们认为具有一门编程语言的资格,在后续的不断发展中,js在原生的基础上扩展了基于jquery等等的库,甚至衍生了像node.js一样的扩展语言,在最后上随着快速化,工程化,以及一些业务开发的需要,经过不断的完善,最后变成了一种angular的框架,这就是简单的js的发展历史,但是今天我们的重点不在于讲述js发展的历史,而注重在于分析其中原生态js的一些特性,诸如prototype. 译过来就是原型的意思,那么什么是原型呢…

JS原型的剖析与理解

原型相关的概念关于面向对象的概念类 class 在js中就是构造函数在传统的面向对象语言中,使用一个叫类的东西定义模版,然后使用模版创建对象在构造方法中也具有类似的功能,因此称其为类实例与对象实例一般是指某一个构造函数创建出来的对象,我们称这个对象为这个构造函数的实例实例就是一个对象,对象是一个泛称键值对与属性和方法在js中键值对的集合称为对象如果值为数据(非函数),就称该键值对为对象的属性 property 如果值为函数,就称为对象的方法 method 父类与子类传统的面…

理解JS原型和原型链

本文通过对<JavaScript高级程序设计>第六章的理解,加上自己的理解,重组了部分内容,形成下面的文字. 理解了原型这个概念,你的JS世界会清明很多. 为什么要为JS创造原型这个概念在没有原型概念之前,我们可以通过创建各种形式的函数来模拟类,但总有这样那样的不足,比如下面的 function Person(name, age, job){ this.name = name; this.age = age; this.job = job; this.sayName = sayName; }…

js原型和原型链理解到面向对象

一.js中的两种对象,普通对象和函数对象 var obj1 = {}; var obj2 =new Object(); var obj3 = new obj1(); function fun1(){}; var fun2 = function(){}; var fun3 = new Function('str','console.log(str)'); 第一种是普通对象,第二种是函数对象.上面两种对象三种情况,我们首先来分析一下对象,在js中如何实现面向对象思想,所谓的面向对象,对象基于模板来创…

37.js----浅谈js原型的理解

浅谈Js原型的理解一.js中的原型毫无疑问一个难点,学习如果不深入很容易就晕了! 在参考了多方面的资料后,发现解释都太过专业,对于很多还没有接触过面向对象语言的小白来说,有理解不了里面的专有名词!如果你没学过c++或者Java之类的更接触底层的语言,那就不要太深究,理解会用自然可以了,当接触到更多语言时慢慢的会理解越来越深刻! 下面我就举例分享一下prototype的概念!知道对于初学者知道这些就足够了! 分析一下,上面这个例子!我们可以知道 People的类型是一个对象!按照j…

彻底弄懂JS原型与继承

本文由浅到深,循序渐进的将原型与继承的抽象概念形象化,且每个知识点都搭配相应的例子,尽可能的将其通俗化,而且本文最大的优点就是:长(为了更详细嘛). 一.原型首先,我们先说说原型,但说到原型就得从函数说起,因为原型对象就是指函数所拥有的prototype属性(所以下文有时说原型,有时说prototype,它们都是指原型). 1.1 函数说到函数,我们得先有个概念:函数也是对象,和对象一样拥有属性,例如: function F(a, b) { return a * b; } F.length…

js原型链和继承

在了解js原型链之前构造函数.原型对象.对象实例这几种概念必须要明白. 1. 创建对象有几种方法 //原型链指向objectvar o1={name:'o1'}; var o11=new Object({name:'o11'});//通过new来声明对象 var M=function(){this.name='o2'} //使用显示的构造函数创建对象 var o2=new M(); var P={name:'o3'}; var o3=Object.create(P) 每个对象都有一个__prot…

简单粗暴地理解js原型链–js面向对象编程

简单粗暴地理解js原型链–js面向对象编程作者:茄果链接:http://www.cnblogs.com/qieguo/archive/2016/05/03/5451626.html 原型链理解起来有点绕了,网上资料也是很多,每次晚上睡不着的时候总喜欢在网上找点原型链和闭包的文章看,效果极好. 不要纠结于那一堆术语了,那除了让你脑筋拧成麻花,真的不能帮你什么.简单粗暴点看原型链吧,想点与代码无关的事,比如人.妖以及人妖. 1)人是人他妈生的,妖是妖他妈生的.人和妖都是对象实例,而人他妈和妖他妈…

JS原型链与继承别再被问倒了

原文:详解JS原型链与继承摘自JavaScript高级程序设计: 继承是OO语言中的一个最为人津津乐道的概念.许多OO语言都支持两种继承方式: 接口继承和实现继承 .接口继承只继承方法签名,而实现继承则继承实际的方法.由于js中方法没有签名,在ECMAScript中无法实现接口继承.ECMAScript只支持实现继承,而且其实现继承主要是依靠原型链来实现的. 概念简单回顾下构造函数,原型和实例的关系: 每个构造函数(constructor)都有一个原型对象(prototype),原型…

js原型作用域

了解JavaScript原型链之前首先肯定要知道什么是原型. JavaScript中,原型是一个对象,通过原型可以实现属性的继承.既然原型是一个对象,那么任何一个对象都可以称为原型吗?是,记住它.什么对象有原型?任何对象(undefined,null,boolean,number,string是主类型,不是对象)默认情况下都有一个原型,但是原型也是一个对象,所以对象的原型也有原型,记住,下面有用. js中的对象中都包含一个指向原型对象的指针,但是是不能被直接访问的,为了方便的看到原型,chrom…

【学习笔记】深入理解js原型和闭包系列学习笔记——精华

深入理解js原型和闭包笔记: 1．“一切皆是对象”,对象是属性的集合. 丨函数也是对象,但是使用typeof时为什么函数返回function而丨不是object呢,js为何要对函数做这样的区分?函数和对象到底什么关系呢? 2.函数和对象的关系(对象是函数创建的,但同时函数又是一种对象) 丨对象是通过函数创建的,那它的属性是如何通过函数构造的,又为什么说函数自身也是一种丨对象呢,函数有什么对象的特征(对象的特质是属性的集合),难道函数也是属性的集合?它丨有什么属性呢? 3.函数的属性…

【学习笔记】深入理解js原型和闭包（18）——补充：上下文环境和作用域的关系

本系列用了大量的篇幅讲解了上下文环境和作用域,有些人反映这两个是一回儿事.本文就用一个小例子来说明一下,作用域和上下文环境绝对不是一回事儿. 再说明之前,咱们先用简单的语言来概括一下这两个的区别. 00 上下文环境: 可以理解为一个看不见摸不着的对象(有若干个属性),虽然看不见摸不着,但确实实实在在存在的,因为所有的变量都在里面存储着,要不然咱们定义的变量在哪里存? 另外,对于函数来说,上下文环境是在调用时创建的,这个很好理解.拿参数做例子,你不调用函数,我哪儿知道你要给我传什么参数? 01 作…

【学习笔记】深入理解js原型和闭包（16）——完结

之前一共用15篇文章,把javascript的原型和闭包讲解了一下. 首先,javascript本来就“不容易学”.不是说它有多难,而是学习它的人,往往都是在学会了其他语言之后,又学javascript.有其他语言的学习经历和实践经历,再加上自学javascript,边学边用,肯定会产生许多误解,走许多弯路.我就没少经历,也算是一种教训. 其次,原型和闭包又是一对难兄难弟,一来是他俩比较难懂,而来是他俩都或多或少的给初级开发人员带来许多BUG.不懂原型和闭包,你也可以开发javascript程序…

【学习笔记】深入理解js原型和闭包（15）——闭包

前面提到的上下文环境和作用域的知识,除了了解这些知识之外,还是理解闭包的基础. 至于“闭包”这个词的概念的文字描述,确实不好解释,我看过很多遍,但是现在还是记不住. 但是你只需要知道应用的两种情况即可——函数作为返回值,函数作为参数传递. 第一,函数作为返回值如上代码,bar函数作为返回值,赋值给f1变量.执行f1(15)时,用到了fn作用域下的max变量的值.至于如何跨作用域取值,可以参考上一节. 第二,函数作为参数被传递如上代码中,fn函数作为一个参数被传递进入另一个函数,赋值给f参数.…

【学习笔记】深入理解js原型和闭包（13）——【作用域】和【上下文环境】

上文简单介绍了作用域,本文把作用域和上下文环境结合起来说一下,会理解的更深一些. 如上图,我们在上文中已经介绍了,除了全局作用域之外,每个函数都会创建自己的作用域,作用域在函数定义时就已经确定了.而不是在函数调用时确定. 下面我们将按照程序执行的顺序,一步一步把各个上下文环境加上.另外,对上下文环境不了解的朋友,可以去看看之前的两篇文章: https://www.cnblogs.com/lauzhishuai/p/10078231.html https://www.cnblogs.com/lau…

【学习笔记】深入理解js原型和闭包（12）——简介【作用域】

提到作用域,有一句话大家(有js开发经验者)可能比较熟悉:“javascript没有块级作用域”.所谓“块”,就是大括号“{}”中间的语句.例如if语句: 再比如for语句: 所以,我们在编写代码的时候,不要在“块”里面声明变量,要在代码的一开始就声明好了.以避免发生歧义.如: 其实,你光知道“javascript没有块级作用域”是完全不够的,你需要知道的是——javascript除了全局作用域之外,只有函数可以创建的作用域. 所以,我们在声明变量时,全局代码要在代码前端声明,函数中要在函数体一…

【学习笔记】深入理解js原型和闭包（6）——继承

为何用“继承”为标题,而不用“原型链”? 原型链如果解释清楚了很容易理解,不会与常用的java/C#产生混淆.而“继承”确实常用面向对象语言中最基本的概念,但是java中的继承与javascript中的继承又完全是两回事儿.因此,这里把“继承”着重拿出来,就为了体现这个不同. javascript中的继承是通过原型链来体现的.先看几句代码以上代码中,f1是Foo函数new出来的对象,f1.a是f1对象的基本属性,f1.b是怎么来的呢?——从Foo.prototype得来,因为f1.__prot…

【学习笔记】深入理解js原型和闭包（5）——instanceof

又介绍一个老朋友——instanceof. 对于值类型,你可以通过typeof判断,string/number/boolean都很清楚,但是typeof在判断到引用类型的时候,返回值只有object/function,你不知道它到底是一个object对象,还是数组,还是new Number等等. 这个时候就需要用到instanceof.例如: 上图中,f1这个对象是被Foo创建,但是“f1 instanceof Object”为什么是true呢? 至于为什么过会儿再说,先把instanceof判…

【学习笔记】深入理解js原型和闭包（1）—— 一切都是对象

“一切都是对象”这句话的重点在于如何去理解“对象”这个概念. ——当然,也不是所有的都是对象,值类型就不是对象. 首先咱们还是先看看javascript中一个常用的运算符——typeof.typeof应该算是咱们的老朋友,还有谁没用过它? typeof函数输出的一共有几种类型,在此列出: function show(x) { console.log(typeof x); // undefined console.log(typeof 10); // number console.log(type…

完全理解JS原型指南

目录 Table of Contents generated with DocToc 目录一.参考书籍和数据二.原型,[[prototype]]和.prototype以及constructor 三.原型链 for...in和in操作符四.属性设置和屏蔽五.JavaScript只有对象六.构造函数和new关键字七.模仿类八.对constructor的错误理解九.原型继承十.类之间的关系十一.总结有问题就留言交流我很乐意一.参考书籍和数据翻看了几本JS书籍,其中主要有以下几…

js原型和原型链的问题

关于JS原型以及原型链、instanceof的一些理解

一.JS原型首先要区分两个概念 1.构造函数 2.实例:由构造函数通过new方式创建出来的就是实例 <script> function Foo() { } var f = new Foo(); console.log(f instanceof Foo); </script> 比如上面这段代码,f是由new Foo()出来的,那么f称为Foo的实例,Foo也称为f实例的构造函数 1.每一个函数都有一个属性 prototype,这个属性也称该函数的显示原型,prototype是一个空…

JS原型，原型链，类，继承，class，extends，由浅到深

一.构造函数和原型 1.构造函数.静态成员和实例成员在ES6之前,通常用一种称为构造函数的特殊函数来定义对象及其特征,然后用构造函数来创建对象.像其他面向对象的语言一样,将抽象后的属性和方法封装到对象内部. function Person(uname, age) { this.uname = uname; this.age = age; this.say = function() { console.log('我叫' + this.uname + ',今年' + this.age + '岁.'…

js原型链结构理解

在一般的面向对象的语言中,都存在类(class)的概念,类就是对象的模板,对象就是类的实例. 但在js中是没有类的定义的(万物皆是对象). 题外话:但是在ES6中提供了更接近传统语言的写法,引入了Class(类)这个概念,作为对象的模板.通过class关键字,可以定义类. 为了在对象直接建立联系(如继承),起初通过构造函数(constructor)实现.但是构造函数存在一个弊端,那就是同一个对象实例之间,无法共享属性.如下: function Person(name,height){ this…

谈谈我认识的js原型

众所周知,JavaScript中是没有传统类的概念的,js通过原型链的方式实现继承.原型是js学习中的一大重点知识,在ES6出来之前,因为js不像php.java一样拥有类的写法,所以继承方式也就不像php.java一样通过关键字extends实现子类继承父类的方式,但是js有它独特的实现继承的方式,这种方式有:prototype.原型冒充.复制继承. 1.prototype js中每个函数就是一个对象,每个对象都有自己的prototype属性,通过这个属性,可以指定某一类对象的原型 funct…