JS-面向对象-原型对象继承

最新推荐文章于 2022-04-20 10:18:43 发布
最新推荐文章于 2022-04-20 10:18:43 发布
阅读量268 收藏
点赞数
分类专栏： JS-面向对象 文章标签： JS-面向对象-原型对象继承
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_45802159/article/details/103277821
版权 

<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <script>
        // 1. 默认的原型对象继承

        // 原型对象中的所有属性和方法都会被其实例继承，这被称为原型对象继承，这也是 JS 默认的继承方式。

        // 例如，obj1 默认继承了 Object.prototype 原型对象中的所有属性和方法
        var obj1 = {
            name: '杨柯'
        };
        console.log(Object.prototype)
        console.log(obj1)

        // 再例如，arr1 默认继承了 Array.prototype 原型对象中所有属性和方法
        var arr1 = ['red', 'green', 'blue'];

        console.log(Array.prototype)
        console.log(arr1)


        // 原型对象链，arr1.__proto__  ---> Array.prototype.__proto__  ---> Object.prototype
        // 继承链，    arr1 --继承--> Array.prototype --继承--> Object.prototype
        // 因此，arr1 既是 Array 的实例（后代） ，又是 Object 的实例（后代）
        console.log(arr1 instanceof Array);  // true
        console.log(arr1 instanceof Object);  // true

    </script>
</body>

</html>
上头upup
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
js原型继承的两种方法对比介绍
12-04
在实际的项目中，我们通常都是用构造函数来创建一个对象，再将一些常用的方法添加到其原型对象上。最后要么直接实例化该对象，要么将它作为父类，再申明一个对象，继承该父类。 而在继承的时候有两种常用方式，今天我们就来稍作探讨 代码如下://父类 function Person(name){    this.name = name;};  // 子类 function Student(sex){  Person.apply(this,arguments); //继承父类的构造函数  this.sex=sex; }; 1，继承Prototype： 代码如下:Student.prototype = Pers
JavaScript 原型对象的继承方法
encircles的博客
06-17 250
function Person(name){ this.name=name; } function Student(name){ this.person=Person;//冒充对象的方式继承 this.person(name); }
JS基础之原型对象，使用原型对象实现方法继承
Y_secret的博客
07-05 336
原型 prototype 我们所创建的每一个函数，解析器都会下个函数中添加一个属性prototype。每一个函数都有自己唯一的prototype 如果函数作为普通函数被调用，prototype没有任何作用 如果作为构造函数被调用，每一个创建的实例都会有一个__proto__ 隐含属性，这个属性指向这个函数的原型对象 原型对象相当于一个公共区域，所有同意一个类的实例都可以访问这个原型对象，因此可以把这些实例的共有内容放到原型对象中。 语法：MyClass.prototype.（属性、方法） = 具体属性或
js对象、原型、继承
小满的博客
12-19 102
prototype 每个函数都有一个prototype属性，而他的属性值是一个对象，默认只有一个叫做constructor的属性，指向这个函数本身。 原型既然作为对象（属性的集合），除了constructor外，还可以自定义许多属性。 当然了，我们也可以在自己定义的方法的prototype中增加我们自己的属性，比如像下面这样的： function Fn() { } Fn.prototype...
JS面向对象的继承三种方法：原型继承，原型冒充继承，复制继承
SUNLYH2_2的博客
01-14 1564
1.原型继承function Dog(){ this.a = function(){ alert(“123”); } }function SDog(){ this.b = function(){ alert(“321”); } }// Dog.prototype = new SDog(); var DD = new
javascript 面向对象全新理练之原型继承
10-29
利用原型继承的关键有两步操作，需要的朋友可以参考下。
JS Pro-深入面向对象的程序设计之继承的详解
10-27
一般的面向对象程序语言，有两种继承方法——接口继承（interface inheritance）和实现继承（implementation inheritance）。接口继承只继承方法签名，而实现继承则继承实际的方法。在JavaScript中，函数没有签名，...
JS深度揭秘第五章-面向对象编程
06-11
此章节会详细介绍对象的概念...会着重的讲解面向对象编程，通俗的解释一些晦涩的概念，如：构造函数、实例、原型、继承等。用独特的方式去讲解面向对象编程的方式以及ES6的面向对象编程，可以很轻松的理解面向对象编程
简单分析javascript面向对象与原型
10-24
为了说明 JavaScript 是一门彻底的面向对象的语言，首先有必要从面向对象的概念着手 , 探讨一下面向对象中的几个概念：1.一切事物皆对象，2.对象具有封装和继承特性，3.对象与对象之间使用消息通信，各自存在信息...
JavaScript函数、闭包、原型、面向对象学习笔记
10-18
给大家分享了一篇关于JavaScript函数、闭包、原型、面向对象的知识点学习笔记内容，有兴趣的朋友参考下。
关于js的对象原型继承(一)
dietisi8980的博客
07-04 63
javascript中，对象的继承是通过原型去继承。 可以这样理解：js中的对象，包含的除了属性和方法，还有一个最基本的原型__proto__对象。这个原型__proto__指向谁，这个对象就继承谁。这是最容易理解对象原型继承的一种方式。 如下面的代码： var student={ name:'zhangsan', age:21, run:func...
js --- 面向对象之原型与原型链
ggmshm的博客
08-09 104
前言： 每个构造函数(constructor)都有一个原型对象(prototype),原型对象都包含一个指向构造函数的指针,而实例(instance)都包含一个指向原型对象的内部指针. 原型定义：Person.prototype 原型是function对象的一个属性，它定义了构造函数产生的对象的公共祖先。 通过构造函数产生的对象，可以继承该原型的属性和方法。 原型也是对象。 利用原型的...
【JavaScript】js中的原型继承
南栀的博客
04-13 3260
js中的原型继承
js原型继承
qq_38217940的博客
04-20 4092
这是一道非常经典的前端面试题，尤其是对于初中级前端来说，基本上是必考题。
【web前端-理解js原型】理解Javascript中的原型对象、原型链和继承
晚秋星辰
11-14 2759
一、理解原型对象当创建一个新函数时，系统会根据一组特定的规则为函数创建一个prototype属性，该属性会指向一个名为原型对象的对象，在默认情况下，该对象会自动生成一个构造函数（constructor），该构造函数是一个指向函数的指针。而在原型对象中，除了有这个构造函数，我们还可以添加其他的属性和方法。 通俗来讲就是，当我们新建一个函数A时，函数A内部会有一个属性，该属性指向一个对象（名字叫原型
【JS】深入理解JS原型和继承
热门推荐
胡小小六的博客
06-13 1万+
说明：内容总结自王福朋的博客内容，原博客链接为：http://www.cnblogs.com/wangfupeng1988/tag/%E5%8E%9F%E5%9E%8B%E9%93%BE/ 前言  在学习JS中的原型，原型链，继承这些知识之前，我们先学习下基础知识：函数和对象的关系。  我们一直都知道，函数也是对象的一种，因为通过instanceof就可以判断出来。但是函数和对象...
JS-面向对象-创建具有私有属性的构造函数(2种方法)
qq_45802159的博客
11-27 534
方式1 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equi...
JS-面向对象-使用字面量的形式创建函数
qq_45802159的博客
11-25 522
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...
JS-面向对象-对象属性的查找顺序
qq_45802159的博客
11-27 499
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...
原生js面向对象继承
最新发布
10-17
在原生 JavaScript 中，可以通过构造函数和原型链来实现面向对象继承。具体实现方式如下： 1. 构造函数继承 构造函数继承是通过在子类构造函数中调用父类构造函数来实现的。这种方式的缺点是无法继承父类原型上的方法和属性。 ```javascript function Parent(name) { this.name = name; } function Child(name, age) { Parent.call(this, name); this.age = age; } var child = new Child('Tom', 18); console.log(child.name); // Tom console.log(child.age); // 18 ``` 2. 原型链继承 原型链继承是通过将子类的原型指向父类的实例来实现的。这种方式的缺点是所有子类实例共享父类实例上的属性和方法。 ```javascript function Parent() { this.name = 'parent'; } Parent.prototype.sayHello = function() { console.log('Hello'); }; function Child() {} Child.prototype = new Parent(); var child1 = new Child(); var child2 = new Child(); console.log(child1.name); // parent console.log(child2.name); // parent child1.sayHello(); // Hello child2.sayHello(); // Hello ``` 3. 组合继承 组合继承是将构造函数继承和原型链继承结合起来使用的一种方式。这种方式既可以继承父类实例上的属性和方法，也可以继承父类原型上的属性和方法。 ```javascript function Parent(name) { this.name = name; } Parent.prototype.sayHello = function() { console.log('Hello'); }; function Child(name, age) { Parent.call(this, name); this.age = age; } Child.prototype = new Parent(); Child.prototype.constructor = Child; var child = new Child('Tom', 18); console.log(child.name); // Tom console.log(child.age); // 18 child.sayHello(); // Hello ```

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值