首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

理解JS 原型

这需要我们先理解原型对象的概念。 #原型对象 我们先了解原型对象的概念。 每个对象都有原型对象(null除外),我们用__proto__表示,每个函数都有prototype属性,指向实例的原型对象。...#原型原型链简单用一句话概括就是: 原型链就是 对象的__proto__所连接的链状结构 为了方便我们理解原型链,举一个简单的例子: function F(){ this.a = 1;...#补充 constructor 说一下我的经历,一开始理解原型链时,一直在prototype、__proto__、constructor在这个三个属性中绕来绕去。...为了便于理解,我把constructor放在最后了。 constructor字面意思就很容易理解,构造函数的意思。...一句话解释: 每个原型对象都有一个 constructor 属性指向 关联的构造函数

1.7K10

JS高级」构造函数原型

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

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

    JS高级——构造函数原型

    概述 在典型的OOP的语言中(如Java),都存在类的概念,类就是对象的模板,对象就是类的实例,但在ES6之前,JS中并没有引入类的概念。...在JS中,使用构造函数要注意以下两点: 构造函数用于创建某一类对象,其首字母要大写。 构造函数要和new一起使用才有意义。...构造函数原型prototype 构造函数通过原型分配的函数是所有对象所共享的。...一般情况下,对象的方法都在构造函数原型对象中设置,如果有多个对象的方法,我们可以给原型对象采取对象形式赋值,但是这样就会覆盖构造函数原型对象原来的内容,这样修改后的原型对象 constructor 就不再指向当前构造函数了...所以ES6的类其实就是语法糖 语法糖:就是一种便捷写法,简单理解,有两种方式可以实现同样的功能,但是一种写法更加清晰、方便,那么这个方法就是语法糖。

    1.5K10

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

    但在js中不存在类的概念,js不是基于类,而是通过构造函数(constructor)和原型链(propotype chains)实现的。...所以,缺点就是:同一个构造函数的对象实例之间无法共享属性和方法。   为了解决构造函数的这个缺点,js提供了prototype属相来解决该问题。   ...propotype属性的作用   js中每个数据类型都是对象,除了null 和 undefined,而每个对象都是继承自一个原型对象,只有null除外,它没有自己的原型对象,最终的Object的原型为null...3.了解了构造器,我们来看下原型prototype   JS中万物都是对象,但是对象也分为:普通对象和函数对象,也就是Object 和 Function.   那么怎么区分普通对象和函数对象呢?...js创建对象的时候都有一个__propo__内置属性,用于指向创建它的函数对象的原型对象prototype。   我们还是来根据eg3的代码来分析原型链   console.log(girl.

    70320

    理解构造函数原型对象

    ,有时候,在我们无意间就已经在使用了这些特性,什么构造函数,原型,个人觉得,初次理解起来很是抽象,自己也是稀里糊涂的觉得实际开发中到底有什么卵用,也许后者在不涉及复杂的功能需求时,平时用得不多,显然Es6...中已新增了类class的功能,越来越严格,越来越像后端语言,Es6,Es7新增的诸多方法也越来越强大,但是我觉得理解构造函数原型对象还是有必要的,是js面向对象编程的基础,今天就我的学习和使用跟大家分享一下学习心得...从上结果中可以得出:当构造函数自定义的属性名与该构造函数原型属性名相同时,构造函数的自定义属性优先于原型属性(可以把构造函数理解为内联样式),而原型属性或者原型方法可以看做是class) 小结:构造函数就是用...,在原型里,是原型链,构造函数原型之间的连接就是原型链,当访问对象的某个属性时,js首先在自定义的属性的作用域内查找该变量是否存在,如果不存在,则会沿着原型链向原型下的查找该属性,直至顶层Object...: 本篇主要是本人对构造器函数原型对象的一点点理解,new操作符调用的函数为构造函,功能上与内置的函数并没有多大的区别,构造函数首字母大写用来区分普通函数还是构造函数,构造函数中的this指向该实例化的构造函数

    1.1K40

    JS高级原型以及函数调用方式

    JavaScript 高级 目标 原型 ==函数原型链== 函数和对象的原型链关系 函数的4种调用方式 箭头函数 2.原型 prototype -重点 原型上存放函数 解决了同一个 say 浪费 内存的问题...原型本质是一个对象,理解为 JavaScript 自动帮我们添加的,只要是构造函数,系统会默认的为构造函数关联一个对象,这个对象就称为构造函数原型,写在原型中的成员,可以被构造函数所创建的实例调用 原型是...JavaScript 自动帮我们在定义构造函数的时候添加的 所有构造函数的实例,共享一个原型 原型上一般是挂载函数 图示 3.原型 proto Javascript 规定,每一个(构造)函数都有一个...一个构造函数可以有很多实例。 原型:每一个构造函数都有一个属性prototype,函数的prototype属性值就是原型。通过构造函数创建出来的实例能够直接使用原型上的属性和方法。...num1 = 22;//局部变量 console.log(num); // 全局变量在任何地方都能访问到 console.log(num1); } console.log(num); 在js

    9610

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

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

    1.6K20

    理解原型原型

    原型原型链是学习JavaScript这门语言不能不理解的两个重要概念,为什么?因为JavaScript是一门基于原型的语言。 怎么理解“JavaScript是一门基于原型的语言”?...看下面一段代码来理解原型: var Person = function(name){ this.name = name; } Person.prototype.sayHi...__proto__),控制台打印的结果是function(){},为什么Person的原型是function呢?这是因为Person是一个构造函数,它的本质就是一个函数。...hasOwnProperty 函数: hasOwnProperty 函数可以用来检查对象自身是否含有某个属性,返回值是布尔值,当属性不存在时不会向上查找对象原型链。...getOwnPropertyNames 函数: getOwnPropertyNames 函数可以获取对象所有的自身属性,返回值是由对象自身属性名称组成的数组,同样不会向上查找对象原型链。

    56120

    JS原型原型

    函数本质上是Object类型,也就是一个对象。...值得注意的是typeof (null)会返回Object,这是因为JS二进制前三位都为0的话会被判断为Object类型,null的二进制表示是全0,自然前三位也是0,所以执行typeof时会返回Object..."; console.log(stu.name) // Ming prototype 每个函数对象都会有一个prototype属性,prototype就是调用构造函数所创建的那个实例对象的原型,prototype...,它总是指向prototype,就是指向构造函数Student的原型对象prototype。...原型链可以简单理解为将原型连成一条链,js每一次获取对象中的属性都是一次查询过程,如果在自有属性中找不到就会去原型对象中查找,如果原型对象中还查不到,就回去原型对象的原型中查找,也就是按照原型链查找,

    1.7K50

    js构造函数理解

    作为原型原型链的基础,先了解清楚构造函数以及它的执行过程才能更好地帮助我们学习原型原型链的知识。 1、什么是构造函数 2、为什么要使用构造函数?...3、构造函数的执行过程 4、构造函数的返回值 5、构造函数首字母必须大写吗? 6、不用new关键字,直接运行构造函数,是否会出错?如果不会出错,那么,用new和不用new调用构造函数,有什么区别?...1、什么是构造函数 在 JavaScript 中,用 new 关键字来调用的函数,称为构造函数。构造函数首字母一般大写 2、为什么要使用构造函数?...以上就是构造函数的整个执行过程。 4、构造函数的返回值 构造函数执行过程的最后一步是默认返回 this 。言外之意,构造函数的返回值还有其它情况。下面我们就来聊聊关于构造函数返回值的问题。...并且该对象继承函数原型; 属性和方法被加入到this引用的对象中; 隐式返回this对象(如果没有显性返回其他对象) 用伪程序来展示上述变化: function Person(name){ //

    2.2K31

    js原型原型

    ) // Kevin Person 就是一个构造函数,使用 new 创建了一个实例对象 person 原型(prototype) 每个函数都有一个 prototype 属性 每一个JavaScript对象...__proto__ === Person.prototype); // true constructor 每个原型prototype 都有一个 constructor(构造函数)属性,这个属性(是一个指针...原型原型链 一张图搞懂: 函数与 Function 的关系 函数就是 Function 的实例....即 Function 就是函数的构造函数,实例对象有一个继承的 constructor 属性, 该方法指向就是构造函数 自己定义一个函数( 任意的函数 ), 可以知道函数的 constructor 就是...__proto__ === Object.prototype); // true 应用 继承 看我这篇文章:js实现继承 增删查改 function Person() { } // 增 Person.prototype.name

    2.1K10

    理解原型链中的函数和对象

    proto__)等于构造这个对象的构造函数的显式原型(prototype) 确实,所有对象都符合这句真理,在控制台打印一试便知: const str = new String("123") str....__proto__ === Object.prototype // true Function 这个终极构造函数,通过查找显式原型的隐式原型,竟然等于 Object 的显式原型!...__proto__=== Object.prototype // true 所有构造函数的显式原型的隐式原型 等于 Object 的显式原型!! ---- 理解 为什么要这样设定呢??...为什么构造函数用 .prototype.__proto__ 向上查找,能找到 Object ? 这样原型链查找不是有两套逻辑吗?...再来看这张经典的图: 按照咱们“理解”也画一个: 哈哈哈,害行,这次就先理解到这吧。 OK,以上便是本篇分享。

    39610

    原型原型理解_原型对象和原型

    一、原型 ①所有引用类型都有一个__proto__(隐式原型)属性,属性值是一个普通的对象 ②所有函数都有一个prototype(原型)属性,属性值是一个普通的对象 ③所有引用类型的__proto...__属性指向它构造函数的prototype var a = [1,2,3]; a....__proto__ === Array.prototype; // true 二、原型链 当访问一个对象的某个属性时,会先在这个对象本身属性上查找,如果没有找到,则会去它的__proto__隐式原型上查找...,即它的构造函数的prototype,如果还没有找到就会再在构造函数的prototype的__proto__中查找,这样一层一层向上查找就会形成一个链式结构,我们称为原型链。...__proto__ === null ③所有从原型或更高级原型中的得到、执行的方法,其中的this在执行时,指向当前这个触发事件执行的对象 版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人

    58130

    JS面试必问-JS原型原型

    为什么需要原型js中万物皆对象,对象可以说是重中之重了。每一个对象都拥有自己的属性。但是在这个世界中有很多东西都是相似的,可以归为一类,他们有共同的方法和属性。不可能让每一个对象都定义一个属性吧。...所以,在js中怎么才能让多个对象共享一个或多个方法呢?原型的出现就是为了解决这个问题。...原型对象有一个constructor属性,默认指向对应的构造函数。 什么是原型链 根据字面意思我们可以这样理解,就是将原型连成一条链。...我们上面讲过,js每一次获取对象中的属性都是一次查询过程,如果在自有属性中找不到就会去原型对象中查找,如果原型对象中还查不到,就回去原型对象的原型中查找,也就是按照原型链查找,直到查找到原型链的顶端,也就是...在js中,对象都有__proto__属性,一般这个是被称为隐式的原型,该隐式原型指向构造该对象的构造函数原型

    1.6K20

    JS进阶:原型原型

    JS进阶:原型原型链 image.png JavaScript中除了基础数据类型外都是对象(引用类型)。...这里就需要用到原型(prototype): 每个实例对象( object )都有一个私有属性(称之为 __proto__ )指向它的构造函数原型对象(prototype )。...原型对象默认拥有一个constructor属性,指向指向它的那个构造函数(也就是说构造函数原型对象是互相指向的关系)。...Husky,通过call方法继承Dog中的属性(call方法的作用可以简单理解为将Dog中的属性添加到Husky中,因为还涉及到其他的知识点所以不多赘述),并添加了一个weight属性。...然后用Dog函数创建了一个实例作为Husky的原型对象赋值给Husky.prototype以继承方法。这样,通过Husky函数创建的实例就拥有了Dog中的属性和方法。

    1.4K30

    JS 原型

    JS 原型链 1. 原型原型链的基础结论 1.1 函数与对象的关系 函数是对象,对象都是通过函数创建的。 函数与对象并不是简单的包含与被包含的关系。...1.2 原型的类别 显示原型:prototype,是每个函数function独有的属性。 隐式原型: __proto__,是每个对象都具有的属性。...1.3 原型原型原型:一个函数可以看成一个类,原型是所有类都有的一个属性,原型的作用就是给这个类的一个对象都添加一个统一的方法。...经典的原型原型链的分析 「接下来我们将主要讲解以下类别:」 image-20220110144233519 2.1 函数.prototype **前提结论:**函数都是对象,每个函数都自带一个属性叫做...f.prototype.b = 3; f.prototype.c = 4; // 不要在 f 函数原型上直接定义 f.prototype = {b:3,c:4};这样会直接打破原型链 // o.

    2.3K30

    js原型

    显示原型 1.每一个构造函数都有一个prototype属性,默认指向一个空Object对象(原型对象) function fun(){ } console.log(fun.prototype ) //{...4.每一个原型对象中有一个属性constructor,它指向构造函数 function fun (){ } console.log(fun.prototype.constructor === fun...) //true 5.构造函数与它的原型对象有一个相互引用的关系 6.原型对象上添加的方法用于实例对象上使用 隐式原型 每一个实例对象都有一个__proto__属性,称之为隐式原型 对象的隐式原型的值为其对应构造函数的显示原型的值...test2,发现有直接调用test2 当执行fn.toString(),时,自身对象没有,接下来查找它构造函数原型对象上是否有toString(),发现没有,接下来又继续沿着Fn原型对象的构造函数原型对象上查找找到...toString() 当执行fn.test3()时,查找自身对象没有,它直接的构造函数对象的原型对象上也没有,接下来沿着Fn原型对象的构造函数原型对象的构造函数原型对象上查找,这里已经找到原型链的尽头

    2.1K20

    js原型入门

    前言 本文主要是根据《head first javascript程序设计》摘抄学习而成,学习采用这本书主要是一位阿里大佬的建议,经过近期的学习阅读,发现确实比其他的js书籍能更好的理解和使用js的相关知识...对象图 为了更好地理解对象的结构,我们可以向后端学习,做出对象图,它基本是分为三栏的一个矩形图,第一栏是构造函数名称,第二栏是对象具有的属性,第三栏是对象具有的方法。 ?...构造函数的效率 一般情况下,我们是使用构造函数进行一些类定义的,在构造函数中你会定义一些这个对象需要用到的属性或者方法。比如下面的Dog的代码。...之所以出现这样的问题,是因为我们没有充分利用好js的对象模型,其是基于原型的概念的。 原型是什么 js可以从其他对象那里继承属性和行为,更具体的说js使用原型继承。其中其行为继承的对象称为原型对象。...this是指向原型对象的,同样我们也很好理解在没有原型的时候,this调用指向的是对象本身,但是你在调用原型原型的方法时你可能认为this指向的是原型对象,其实并非如此。

    1.5K11
    领券