首页
学习
活动
专区
工具
TVP
发布

JS高级——构造函数原型

JS中,使用构造函数要注意以下两点: 构造函数用于创建某一类对象,其首字母要大写。 构造函数要和new一起使用才有意义。...构造函数原型prototype 构造函数通过原型分配的函数是所有对象所共享的。...constructor 构造函数 对象原型(__proto__)和构造函数(prototype)原型对象里面都有一个属性 constructor属性,constructor我们称为构造函数,因为它指回构造函数本身...一般情况下,对象的方法都在构造函数原型对象中设置,如果有多个对象的方法,我们可以给原型对象采取对象形式赋值,但是这样就会覆盖构造函数原型对象原来的内容,这样修改后的原型对象 constructor 就不再指向当前构造函数了...一般情况下,对象的方法都在构造函数原型对象中设置,通过构造函数无法继承父类方法。

1.4K10

JS高级」构造函数原型

console.log(ldh.sing === zxy.sing); //返回 false 1.4构造函数原型prototype 构造函数通过原型分配的函数是所有对象所共享的。...constructor 主要用于记录该对象引用于哪个构造函数,它可以让原型对象重新指向原来的构造函数。 一般情况下,对象的方法都在构造函数原型对象中设置。...如果有多个对象的方法,我们可以给原型对象采取对象形式赋值,但是这样就会覆盖构造函数原型对象原来的内容,这样修改后的原型对象 constructor 就不再指向当前构造函数了。...每一个实例对象又有一个__proto__属性,指向的构造函数原型对象,构造函数原型对象也是一个对象,也有__proto__属性,这样一层一层往上找就形成了原型链。...1.8构造函数实例和原型对象三角关系 构造函数的prototype属性指向了构造函数原型对象; 实例对象是由构造函数创建的,实例对象的__proto__属性指向了构造函数原型对象; 构造函数原型对象的

1.5K50
您找到你想要的搜索结果了吗?
是的
没有找到

构造函数原型原型链、继承

JS里一切皆对象,对象是“无序属性的集合,其属性值可以是数据或函数”。...任何一个函数,只要使用了new关键字,它就成了构造函数。...__proto__.greeting = function(){ return 'Hi, there'; } man.greeting(); //Hi, there 动态原型模式 这种模式把给对象添加属性以及给原型添加属性的动作都放到了构造函数里...,就会形成函数、对象、原型之间的三角关系: 此时如果让实例对象指向另一个构造函数的实例对象,这个关系就变成了这样: 实例对象A和实例对象B被一个__proto__属性链接起来了,这已经是一个具有两个节点的链条了...如果在实例对象A上访问某个属性或方法,JS会从实例对象A开始沿着原型链层层查找,直到遇见null。

72220

构造函数原型

1.4构造函数原型prototype 1.构造函数通过原型分配的函数是所有对象所共享的。 2.JavaScript 规定,每一个构造函数都有一个prototype 属性,指向另一个对象。...constructor 主要用于记录该对象引用于哪个构造函数,它可以让原型对象重新指向原来的构造函数。...如果有多个对象的方法,我们可以给原型对象采取对象形式赋值,但是这样就会覆盖构造函数原型对象原来的内容,这样修改后的原型对象 constructor 就不再指向当前构造函数了。...1.7原型链 每一个实例对象又有一个proto属性,指向的构造函数原型对象,构造函数原型对象也是一个对象,也有proto属性,这样一层一层往上找就形成了原型链。 ?...1.8构造函数实例和原型对象三角关系 1.构造函数的prototype属性指向了构造函数原型对象 2.实例对象是由构造函数创建的,实例对象的__proto__属性指向了构造函数原型对象 3.构造函数原型对象的

33010

构造函数原型

1.概述: 在典型的OOP的语言中(如Java) , 都存在类的概念,类就是对象的模板,对象就是类的实例,但在ES6之前, JS中并没用引入类的概念。...4.构造函数原型prototype(原型对象) 构造函数通过原型分配的函数是所有对象所共享的。 JavaScript 规定,每一个构造函数都有一个prototype 属性,指向另一个对象。...constructor 主要用于记录该对象引用于哪个构造函数,它可以让原型对象重新指向原来的构造函数。 一般情况下,对象的方法都在构造函数原型对象中设置。...构造函数实例和原型对象三角关系 1.构造函数的prototype属性指向了构造函数原型对象 2.实例对象是由构造函数创建的,实例对象的__proto__属性指向了构造函数原型对象 3.构造函数原型对象的...8.原型链 每一个实例对象又有一个__proto__属性,指向的构造函数原型对象,构造函数原型对象也是一个对象,也有__proto__属性,这样一层一层往上找就形成了原型链。 ?

45050

详解js原型构造函数以及class之间的原型关系

原型 概念 在构造函数创建的时候,系统默认的帮构造函数创建并关联一个对象 这个对象就是原型 作用 在原型中的所有属性和方法,都可以被和其关联的构造函数创建出来的所有的对象共享 访问原型 构造函数名...,是js内部使用寻找原型链的属性,通过该属性可以允许实例对象直接访问到原型 3. constructor 含义:原型对象的constructor 指向其构造函数,如果替换了原型对象之后,这个constructor...image 原型链 ? image 构造函数以及js原生Object对象之间的原型关系 ? image 原型的注意事项 当对象在访问属性和方法的时候,会现在自身查找,如果没有才回去原型中找。...js通过构造函数以及原型链来实现继承。...ES5中的构造函数(声明属性以及静态方法,这种类创建属性和创建方法参照上面动态原型模式的构造函数

1.5K20

JS精粹】原型链继承和构造函数继承的 “毛病”

构造函数继承 构造函数继承,也叫做:“盗用构造函数”,“对象伪装”或“经典继承”。 基本思路:在子类构造函数中用 apply()和 call()方法调用父类构造函数。...,但是它也有它的问题,也是使用构造函数模式自定义类型的问题, 即:必须在构造函数中定义方法(在原型上定义方法,子类是访问不到的),函数不能重用。...构造函数继承:子类不能访问父类原型上的方法。 咱就是说,这东西怎么这么拧巴呢。。。 于是乎一个规避二者“毛病”的继承方式出现了:组合继承~~ 组合继承 目前最流行的继承模式是组合继承!...思路是:使用原型链继承原型上的属性和方法,而通过构造函数继承实例属性。...说实话,JS 继承真的很奇怪。。。并不是面向对象语言,又要通过原型链去模拟面向对象,真的很多小坑的点需要去注意。

1.2K20

JS中对象+构造函数+原型对象谈恋爱了嘛。

Person("zs", 44); obj2.say(); console.log(obj2.currentType); /** * prototype的特点:存在在原型对象里面的属性与方法可以被构造函数的所有对象所共享...* 如果原型构造函数的属性与方法相同,优先级执行的是构造函数里面的,如果没有到原型里面找. */ ...);//构造函数里面的prototype指向了对象(原型对象) /*2.每个"原型对象"中都有一个默认的属性, 叫做constructor constructor指向当前原型对象对应的那个..."构造函数" */ console.log(Person.prototype.constructor);//原型对象里面的constructor属性指向了函数(当前原型对象对应的那个..."构造函数") /*3.通过构造函数创建出来的对象我们称之为"实例对象" 每个"实例对象"中都有一个默认的属性, 叫做__proto__ __proto__指向创建它的那个构造函数

1.2K10

再谈构造函数原型原型链之间的关系

前言 构造函数原型原型链作为ES5的内容,已经是老生常谈的问题了。首先说说为什么要再次拿起这个话题去说呢?...构造函数 什么是构造函数构造函数就是使用关键字new创建对象时调用的函数。...构造函数的属性可分为两种:1.实例上的属性 2.公用属性 //实例上的属性 function Animal(){ this.name=name; this.age=18; } 原型 原型是每个构造函数都有的...,在JS规定,每一个构造函数都有一个 prototype 属性,指向另一个对象,注意这个prototype就是一个对象,这个对象的所有属性和方法都会被构造函数所拥有。...原型的作用是共享方法,一般情况下,我们的公共属性定义在构造函数里面,公共的方法放到原型对象上。

64420

基础 | 详解面向对象、构造函数原型原型

; b)将该中间对象的原型指向构造函数原型; c)将构造函数的this,指向该中间对象; d)返回该中间对象,即返回实例对象。...通过图示我们可以看出,构造函数的prototype与所有实例对象的__proto__都指向原型对象。而原型对象的constructor指向构造函数。...于是根据构造函数原型的特性,我们就可以将在构造函数中,通过this声明的属性与方法称为私有变量与方法,它们被当前被某一个实例对象所独有。...在这个例子中,我们同时在原型构造函数中都声明了一个getName函数,运行代码的结果表示原型中的访问并没有被访问。...因为构造函数原型的不同特性,分别解决了我们不同的困扰。因此当我们想要实现继承时,就必须得根据构造函数原型的不同而采取不同的策略。

36410

理解构造函数原型对象

中已新增了类class的功能,越来越严格,越来越像后端语言,Es6,Es7新增的诸多方法也越来越强大,但是我觉得理解构造函数原型对象还是有必要的,是js面向对象编程的基础,今天就我的学习和使用跟大家分享一下学习心得...,目的是提高性能),可以看作是对象的基类 作用二:在原有的对象基础上,通过prototype进行额外的,封装,拓展(如后面示例代码) 原型是基于构造函数的(也就是说原型是挂载在构造函数下的,先有构造函数...从上结果中可以得出:当构造函数自定义的属性名与该构造函数原型属性名相同时,构造函数的自定义属性优先于原型属性(可以把构造函数理解为内联样式),而原型属性或者原型方法可以看做是class) 小结:构造函数就是用...,在原型里,是原型链,构造函数原型之间的连接就是原型链,当访问对象的某个属性时,js首先在自定义的属性的作用域内查找该变量是否存在,如果不存在,则会沿着原型链向原型下的查找该属性,直至顶层Object...: 本篇主要是本人对构造函数原型对象的一点点理解,new操作符调用的函数构造函,功能上与内置的函数并没有多大的区别,构造函数首字母大写用来区分普通函数还是构造函数,构造函数中的this指向该实例化的构造函数

1K40

js构造函数

//构造函数 //使自己的对象多次复制,同时实例根据设置的访问等级可以访问其内部的属性和方法 //当对象被实例化后,构造函数会立即执行它所包含的任何代码 function myObject(msg...} //私有和特权成员在函数的内部,在构造函数创建的每个实例中都会包含同样的私有和特权成员的副本, //因而实例越多占用的内存越多  } //公有方法 //适用于通过new关键字实例化的该对象的每个实例...//向prototype中添加成员将会把新方法添加到构造函数的底层中去  myObject.prototype.sayHello = function(){      alert('hello ...(m1.name); //undefined, 静态属性不适用于一般实例 //console.log(m1.constructor.name); //china, 想访问类的静态属性,先访问该实例的构造函数...(类函数)的方法(函数) //m1.sayHello(); //hello everyone, myObject类的prototype原型下的方法将会被实例继承 //myObject.sayHello

2.7K10

JavaScript笔记(2) 构造函数原型

构造函数原型 目标: 这些之前都学过的我就不多赘述了,直接将图片贴上来了 JavaScript的构造函数中可以添加一些成员,可以在构造函数本身上添加,也可以在构造函数内部的this上添加....构造函数原型prototype 构造函数通过原型分配的函数是所有对象所共享的....对象原型__proto__ 对象都会有一个属性__proto__指向构造函数的prototype原型对象,之所以我们对象可以使用构造函数prototype原型对象的属性和方法,就是因为对象有__proto...constructor构造函数 对象原型构造函数原型对象里面都有一个属性constructor属性,constructor我们称为构造函数,因为它指回构造函数本身 如果我们直接打印Star.prototype.constructor...所以现在我们做一步操作,手动利用constructor指回原来的构造函数 构造函数,原型对象,实例之间的关系 说到底这一节听懵逼的,晚点查查资料,明天继续,晚上复习

36210

JS入门难点解析11-构造函数原型对象,实例对象

如果按照字面意思来理解,那么prototype就是通过调用构造函数而创建的那个对象实例的原型对象。...构造函数原型对象和实例对象的关系 5.1 指向关系 构造函数A的prototype属性指向F与其实例对象(a1,a2,...)的原型对象A.prototype,该原型对象的constructor属性指向构造函数...5.1 还记得我们在前面2.1节的空函数构造函数的图片吗?现在来看是不是就很清晰了。明白了其中的指向关系,我们再来看一下,构造函数中添加this语句以及在原型对象中添加属性以后是怎样的情况。...6.2 可以看到,结果和6.1一模一样,当然了,真正的new构造函数的过程不会是这么简单,我们只是通过这个例子使大家能够加深对构造函数原型对象和实例对象的理解。...参考 javascript面向对象系列第一篇——构造函数原型对象 JS入门难点解析10-创建对象 深入理解js构造函数 JavaScript构造函数详解 BOOK-《JavaScript高级程序设计

1.6K10

第186天:js深入理解构造函数原型对象

但在js中不存在类的概念,js不是基于类,而是通过构造函数(constructor)和原型链(propotype chains)实现的。...但在ES6中引入了类(class)这个概念,作为对象的模板,新的class写法知识让原型对象的写法更加清晰,这里不重点谈这个 2.首先我们来详细了解下什么是构造器   构造函数的特点:     a:构造函数的首字母必须大写...所以,缺点就是:同一个构造函数的对象实例之间无法共享属性和方法。   为了解决构造函数的这个缺点,js提供了prototype属相来解决该问题。   ...3.了解了构造器,我们来看下原型prototype   JS中万物都是对象,但是对象也分为:普通对象和函数对象,也就是Object 和 Function.   那么怎么区分普通对象和函数对象呢?...js创建对象的时候都有一个__propo__内置属性,用于指向创建它的函数对象的原型对象prototype。   我们还是来根据eg3的代码来分析原型链   console.log(girl.

68120

秒懂JS对象、构造函数原型对象之间的关系

学习JS的过程中,想要掌握面向对象的程序设计风格,对象模型(原型和继承)是其中的重点和难点,拜读了各类经典书籍和各位前辈的技术文章,感觉都太过高深,花费了不少时间才搞明白(个人智商是硬伤/(ㄒoㄒ)/~...一、基本概念   1、对象:属性和方法的集合,即变量和函数的封装。每个对象都有一个__proto__属性,指向这个对象的构造函数原型对象。   ...3、原型对象:每个函数都有一个prototype属性,它是一个指向原型对象的指针(原型对象在定义函数时同时被创建) 二、创建对象的方法   1、使用构造函数原型对象共同创建 ?...如上图,构造函数Person(),通过new关键字创建了两个实例化对象p1、p2,这两个新对象都继承了,构造器Person()函数prototype属性所指向的原型对象。...通过构造函数创建实例对象p1和p2的时候,其中name、age、job这些是通过构造函数生成的(本地部分),sayName方法是通过继承原型对象来实现共享的(远程部分),这样多个实例对象都是由本地(私有

1.7K70

js 中的构造函数构造函数作用,构造函数和普通函数的区别

构造函数 在 JavaScript 中,用 new 关键字来调用的函数,称为构造函数构造函数首字母一般大写(规范)。...之所以有构造函数与普通函数之分,主要从功能上进行区别的,构造函数的主要 功能为 初始化对象,特点是和new 一起使用。new就是在创建对象,从无到有,构造函数就是在为初始化的对象添加属性和方法。...并且该对象继承函数原型; 属性和方法被加入到this引用的对象中; 隐式返回this对象(如果没有显性返回其他对象) 简单的说 用new调用构造函数,最大特点为,this对象指向构造函数生成的对象...6、 构造函数和普通函数的区别 1、构造函数也是一个普通函数,创建方式和普通函数一样,但构造函数习惯上首字母大写。 2、调用方式不一样。...(ES6 中 class 与构造函数的关 系,通过class定义的类 和通过构造函数定义的类 二者本质相同。并且在js执行时,会将第一种转会为第二种执行。

3.4K10

“工厂、构造原型” 设计模式与 JS 继承

这是我参与「掘金日新计划 · 6 月更文挑战」的第16天,点击查看活动详情 序言 我们在前一篇文章《JS精粹,原型链继承和构造函数继承的 “毛病”》 ,提到了:原型链继承、构造函数继承、组合继承; 在另一篇文章...《蓦然回首,“工厂、构造原型”设计模式,正在灯火阑珊处》,提到了:我们用于创建对象的三种设计模式:工厂设计模式、构造设计模式、原型设计模式; 至此,我们可以明显的感受到:JS 要实现面向对象(继承的能力...),离不开这 3 种设计模式; 原型链 + 构造函数 = 组合继承 本篇带来一个新的继承方式:寄生继承,它由工厂模式和构造函数模式组成,即 工厂+构造函数 = 寄生继承 正文 正是由于:原型链继承和构造函数继承的...构造函数继承:子类不能访问父类原型上的方法。...:工厂、构造原型设计模式; 原型链 + 构造函数 = 组合继承 工厂+构造函数 = 寄生继承; 组合继承和寄生继承是最常用的两种继承方式。

1K30

扫码

添加站长 进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

    运营活动

    活动名称
    广告关闭
    领券