OOP:Object Oriented Programming 面向对象编程。

题外话:面向对象的范围实在太大,先把这些大的东西理解理解。

1.什么是对象?

根据高程和权威指南上的定义,对象是一组没有特定顺序的值,我们可以把对象看成是从字符串到值的映射。

2.怎样理解原型和原型链?

原型:

根据权威指南上的定义:每一个js对象(null除外)都和另一个对象相关联,
“另一个”对象就是我们熟知的原型,每一个对象都从原型上继承属性。原型也是对象。通俗点讲,就是一个拥有prototype属性、且这个属性指向函数的原型对象的对象。

原型的好处就是:原型上的方法和属性会被所有实例所共享

原型链

当访问某个实例属性或方法时,会先自身对象中查找,查不到时再往当前对象原型上找;
若依然没找到,则会继续往原型对象的原型上找,一直到找到结果或者找到Object.prototype为止也没找到,
然后这时就会返回undefined,这么一个链式查找过程形成的结构就叫原型链。

每个对象都有一个__proto__属性,函数也是对象,所以函数也有;
每个函数都有一个prototype属性,而实例对象没有。

3.面向对象的三大特性是什么?

封装,继承,多态(指一个方法可以有多种调用方式:例如有参或无参)

4.创建对象有哪些方式?


(1).对象字面量

let obj={};

(2).Object方式

let obj=new Object();

(3).Object.create

let obj=Object.create({}/null);

注意!!前面这三种方式的的构造函数都是Object,而Object已经是原型链的最顶端了,所以Object.prototype都为undefined。

可以用实例的__proto__.constructor查看构造函数是否指向Object构造函数。

(4).工厂模式

    function person(name,job){let o={};o.name=name;o.job=job;o.sayName=function(){console.log(this.name);}return o;}let p1=person('nagi','sleep');console.log(p1.constructor); // 指向Objectp1 instanceof person;  // false;

优缺点:

这种模式虽然解决了量产对象的问题,但却无法获知当前对象是何类型 (例如类型:Array,Math等内置对象,或者BOM(window)/DOM的宿主对象,又或者自定义对象等)

注意点:函数首字母不用大写。

(5).构造函数模式

    function Person(name,job){this.name=name;this.job=job;this.sayName=function(){console.log(this.name);}}let p1=new Person('nagi','sleep');console.log(p1.constructor); // 指向Personp1 instanceof Person;   // true

与工厂模式区别:

a.没有显式创建对象;
b.直接将属性和方法赋给了this对象
c.不有return语句;

拓展:new操作符做了些什么?

a.创建一个新对象;
b.将构造函数的作用域赋给新对象(因此this就指向一这个新对象);
c.执行构造函数中的代码(为这个新对象添加属性);
d.返回新对象(默认返回当前对象,除非有显示返回某个对象)

优缺点:

首先是解决了工厂模式中不能判断类型的问题;
但缺点是每实例一次的同时还会把方法重新创建一遍,造成内存资源浪费;
其次,因构造函数与其它函数的唯一区别就是调用方式不一样,所以当被当作普通函数调用时,其内部的this会指向全局,引发作用域问题。

(6).原型模式

    function Person(){};// 写法一:Person.prototype.name='nagi';Person.prototype.job='sleep';Person.prototype.sayName=function(){console.log(this.name);};// 写法二:注意,这种直接更改原型指向的写法,会改变constructor指向,指向Object构造函数/* Person.prototype={//  constructor:Person,name:'nagi',job:'sleep',sayName:function (){console.log(this.name)}}*/let p1=new Person();

优缺点:

优点:解决了上述构造函数的缺点,原型对象上的属性和方法为所有实例所共享。
缺点:a.缺点也是所有实例共享方法和属性,因此其中一个实例更改了引用类型的属性值时,其他的实例也会被迫改变。(属性)b.默认情况下所有实例都取得相同的属性值。

(7).组合模式(结合构造函数和原型模式)

    function Person(name,job){this.name=name;this.job=job;}            Person.prototype.sayName=function(){console.log(this.name);}let p1=new Person('nagi','sleep');

4.对象继承方式有哪些?

(1).原型链继承

    function Parent(){this.name='nagi';this.colors=['red','blue','green'];}Parent.prototype.sayName=function(){console.log(this.name);}function Child(){this.job='sleep';};Child.prototype=new Parent(); // 要注意:这种重写原型链的写法是会切断构造函数与最初原型之间的联系的,// 意味着此时Child.prototype.constructor指向Parentvar child=new Child();        
这种方式的基本思想就是利用原型让一个引用类型继承另一个引用类型的属性和方法。

问题点:

a.上述例子中,通过原型继承方式继承相当于专门创建了一个Child.prototype.colors的属性,因为引用类型的原型属性会被所有实例共享,也就意味着Child的所有实例都会共享colors这一属性,当其中一实例修改它的值时,那么其他的实例的值也会跟着被改变。b.在创建子类实例时,不能向超类型的构造函数中传递参数。鉴于此,实际很少单独用原型链继承。

超类型:比如Child类继承了Parent类的属性,那么Parent就是Child的超类(也叫父类)。

(2).构造函数继承(call/apply)

    function Parent(name){console.log(`子类传进的name值是:${name}`)this.name='nagi';this.colors=['red','blue','green'];}Parent.prototype.sayName=function(){console.log(this.name);}function Child(){Parent.call(this,'Bob')this.job='sleep';};var child1=new Child();var child2=new Child();
基本思想是在子类构造函数的内部调用超类(或父类)型构造函数。

优缺点:

优势:解决了原型链的两个问题;
缺点:a. 方法都在构造函数定义的话,那函数复用就无从谈起了。b. 父类在原型中定义的方法,对于子类型来说是不可见的。鉴于此,构造函数也很少用。[捂脸]

(3).组合继承(即原型链+构造函数)

    function Parent(name){this.name=name;this.job='sleep';this.colors=['red','blue','green'];}Parent.prototype.sayName=function(){console.log(this.name);}function Child(name){Parent.call(this,name);this.job='eat';}Child.prototype=new Parent();Child.prototype.constructor=Child; let child1=new Child('nagi');let child2=new Child('Bob');
其实现思路是用原型链实现对原型属性和方法的继承,而借助构造函数实现对实例属性的继承。优点:在前两者基础上,补足了构造函数和原型链的缺点,是比较常用的方式。

(4). Object.create继承

    function Parent(name){this.name=name;this.job='sleep';this.colors=['red','blue','green'];}Parent.prototype.sayName=function(){console.log(this.name);}function Child(){Parent.call(this); // 保证构造函数指针指向Child}Child.prototype=Object.create(Parent.prototype,{name:{value:'nagi'},job:{value:'eat'}})// 如果想同时继承多个,还可使用Object.assign()添加属性// Object.assign(A.prototype, B.prototype);let child=new Child();

(5)ES6的extends方式

类继承,class A extends B

复习Javascript专题(三):面向对象(对象的创建与继承,原型及原型链)相关推荐

  1. JavaScript中的面向对象--对象创建

    JavaScript高级程序设计第3版总结p156 1.JavaScript中的对象 首先,ECMAScript 中函数实际上是对象.每个函数都是 Function 类型的实例,而且都与其他引用类型一 ...

  2. 【JavaScript】JavaScript模拟实现面向对象一张图帮助你深刻理解原型链和原型对象

    文章目录 一.JavaScript模拟面向对象 1.函数是类 2.函数中各种变量的声明 3.关于函数内的this 小结:JavaScript中函数是什么? 4.练习:面向对象思想编写Complex类 ...

  3. Java程序员从笨鸟到菜鸟之(二十九)javascript对象的创建和继承实现

    JavaScript对象的创建 JavaScript中定义对象的几种方式(JavaScript中没有类的概念,只有对象): 1) 基于已有对象扩充其属性和方法:  [html] view plainc ...

  4. JavaScript中的面向对象--对象继承

    JavaScript高级程序设计第3版 p162 这里总结一下JavaScript中对象继承的方式,主要有原型链和借用构造函数模式,衍生的出来的有组合式继承.原型式继承.寄生式继承和寄生组合式继承.原 ...

  5. Spring.NET教程(三)——对象的创建(基础篇)

    学过了前面的课程,我们来一起学习Spring.NET的IoC容器对象的创建. 创建对象一般有3种方式:1.构造器创建,2.静态工厂创建,3.实例工厂创建 多数情况下,容器会根据对象定义中的type属性 ...

  6. 链方法[C# 基础知识系列]专题三:如何用委托包装多个方法——委托链

    最近研究链方法,稍微总结一下,以后继续补充: 弁言: 上一专题分析了下编译器是如何来翻译委托的,从中间语言的角度去看委托,希望可以帮助大家进一步的理解委托,然而之前的分析都是委托只是封装一个方法,那委 ...

  7. JavaScript(三)——对象与数组基础及API

    文章目录 数据存储 (1)原始类型存储 (2)引用类型存储 一.面向对象 二.对象 1分类 2 自定义对象创建方式(封装) 3.销毁对象 4.访问.删除对象属性 5.遍历对象 6.检测对象属性 7.方 ...

  8. 复习Javascript专题(二):闭包,内存,以及垃圾回收机制

    1.什么是闭包?闭包有啥特性以及存在什么问题? 概念:闭包是指有权访问另一个函数作用域中的变量的函数.下面的outer就形成了一个闭包: function outer(){const name='na ...

  9. 复习Javascript专题(一):基本概念部分

    一.数据类型 基本类型:`Null Boolean String Undefined Number(NB SUN)`引用类型:`Array Function Object`类型判断:typeof 返回 ...

  10. JavaScript 基础(三) - Date对象,RegExp对象,Math对象,Window 对象,History 对象,Location 对象,DOM 节点...

    Date对象 创建Date对象 //方法1:不指定参数var date_obj = new Date();alert(date_obj.toLocaleString())//方法2:参数为日期字符串v ...

最新文章

  1. 年中总结(2013年3月到2013年9月)
  2. spring boot(5)---RestTemplate请求HTTP(1)
  3. VMWare学习总结(2)——VMware中三种网络连接的区别
  4. 知识图谱组队学习Task05——图数据库查询
  5. Ubuntu20.04之安装搜狗输入法
  6. 手机语音混响软件_Tone2 UltraSpace(音频混响软件)
  7. python report_python之Reportlab模块
  8. 经典成就辉煌:从3Dmark看GPU发展之路
  9. ios越狱python插件_人生苦短,我用Python – 越狱后如何在IOS设备上玩Python编程,2018-07-11 – 算法网...
  10. 全国计算机等级四级计算机网络第6套答案,全国计算机等级考试四级计算机网络第6套试题(2)...
  11. CSR Audio Sink Application User Guide
  12. 苹果cms用拼音伪静态之后,播放页密码访问失效解决方法
  13. 拼多多根据ID取商品详情 API 返回值说明
  14. [日常训练] Surprise me
  15. Richard Stallman称Ubuntu为木马
  16. 字符串匹配问题(信息学奥赛一本通 - T1355)
  17. 我是主考官7:他为什么没有被录取
  18. CoCa:多模态图像-文本基础模型
  19. 如何更改图片的背景色(PS、证件照之星)
  20. phpmailer 通过smtp发送邮件,相同发送内容有的成功有的失败

热门文章

  1. 自然语言处理——分词算法
  2. 腾讯看点CTO徐羽: QQ浏览器背后的推荐AI中台 | AICon
  3. 7月最强书单丨博文视点新品畅销TOP10,让技术带你燃爆整个7月
  4. 每周荐书:MySQL、Kafka、微信小程序(评论送书)
  5. 深入搜索引擎的关键——索引
  6. 系统架构与软件架构是一层含义吗
  7. 2.2TextCNN
  8. linux:文件及目录管理
  9. android自定义控件动态,GitHub - itrenjunhua/WaveView: Android自定义控件实现动态百分比水波纹效果...
  10. js ajax 传输list,jQuery ajax请求返回list数据动态生成input标签,并把list数据赋值到input标签...