1.创建对象

1.字面量对象

2.构造函数

3.Object.create

//1.字面量
var obj={
name: '字面量',
show: function(){
console.log(this.name)
}
}
//2.构造函数
function fun (name) {
this.name=name
}
var obj=new fun('obj')
//3.Object.create
var obj={name: 'obj'}
var obj=Object.create(obj)

2.JavaScript继承

1.原型链继承

function Parent(name){
this.name=name
this.sleep=function(){
console.log(this.name + '在睡觉')
}
}
Parent.prototype.eat=function(food){
console.log(this.name + '正在吃' + food)
}
function Child(){}
Child.prototype=new Parent('Child')
Child.prototype.constructor=Child
var child=new Child()

Child.prototype=new Parent('Child')就是把Parent实例赋值给Child.prototype,也就是说new Child().__proto__===new Parent('Child')

可以通过Child.prototype在原型对象上增加新的属性或方法,也可以通过,child.__proto__在原型对象上添加新的方法和属性。

缺点:

1.原型对象上的属性和方法是所有实例都可访问的,而且一个实例改变了原型上的方法和属性都会影响到其他实例。

2.创建子类实例时,无法向父类构造函数传参。

2.构造函数继承

function Parent(name){
this.name=name
this.sleep=function(){
console.log(this.name + '在睡觉')
}
}
Parent.prototype.eat=function(food){
console.log(this.name + '正在吃' + food)
} function Child(){
Parent.call(this,'child')
}
Child.prototype.eyes=function(){console.log('eyes')}
var child=new Child()

构造函数继承可以通过call或apply方法实现继承。这种方法不能继承原型对象中的属性和方法,只能继承实例属性和实例方法,但是可以向父类传参。

3.组合继承

function Parent(name){
this.name=name
this.sleep=function(){
console.log(this.name + '正在睡觉')
}
}
Parent.prototype.eat=function(food){
console.log(this.name + '正在吃' + food)
}
function Child(){
Parent.call(this,'child')
}
Child.prototype.eyes=function(){console.log('eyes')} Child.prototype=new Parent()
Child.prototype.constructor=Child
var child=new Child()

组合继承是比较好的继承, 他是原型链继承和构造函数继承的结合, 合理的利用了这两种组合的特点,既是子类的实例,也是父类的实例, 但有一个缺点就是调用了两次构造函数。

4.组合继承优化

function Parent(name){
this.name=name
this.sleep=function(){
console.log(this.name + '正在睡觉')
}
}
Parent.prototype.eat=function(food){
console.log(this.name + '正在吃' + food)
}
function Child(){
Parent.call(this,'child')
}
Child.prototype = Object.create(Parent.prototype)
Child.prototype.constructor=Child
var child=new Child()

5.寄生组合继承

function Parent(name){
this.name=name
this.sleep=function(){
console.log(this.name + '正在睡觉')
}
}
Parent.prototype.eat=function(food){
console.log(this.name + '正在吃' + food)
}
function Child(){
Parent.call(this,'child')
}
function f(){}
f.prototype=Parent.prototype
Child.prototype=new f()
Child.prototype.constructor=Child
var child=new Child()

只调用一次父类的构造函数,避免了在子类原型上创建不必要的,多余的属性。

JavaScript继承总结的更多相关文章

  1. javascript继承的三种模式

    javascript继承一般有三种模式:组合继承,原型式继承和寄生式继承: 1组合继承:javascript最为广泛的继承方式通过原型链实现对原型属性和方法的继承,通过构造函数实现对实例属性的继承,同 ...

  2. javascript继承机制的设计思想(ryf)

    我一直很难理解Javascript语言的继承机制. 它没有"子类"和"父类"的概念,也没有"类"(class)和"实例" ...

  3. 【读书笔记】javascript 继承

    在JavaScript中继承不像C#那么直接,C#中子类继承父类之后马上获得了父类的属性和方法,但JavaScript需要分步进行. 让Brid 继承 Animal,并扩展自己fly的方法. func ...

  4. 图解JavaScript 继承

    JavaScript作为一个面向对象语言,可以实现继承是必不可少的,但是由于本身并没有类的概念(不知道这样说是否严谨,但在js中一切都类皆是对象模拟)所以在JavaScript中的继承也区别于其他的面 ...

  5. JavaScript强化教程——Cocos2d-JS中JavaScript继承

    javaScript语言本身没有提供类,没有其它语言的类继承机制,它的继承是通过对象的原型实现的,但这不能满足Cocos2d-JS引擎的要求.由于Cocos2d-JS引擎是从Cocos2d-x演变而来 ...

  6. [原创]JavaScript继承详解

    原文链接:http://www.cnblogs.com/sanshi/archive/2009/07/08/1519036.html 面向对象与基于对象 几乎每个开发人员都有面向对象语言(比如C++. ...

  7. javascript继承(六)—实现多继承

    在上一篇javascript继承—prototype最优两种继承(空函数和循环拷贝)(3) ,介绍了js较完美继承的两种实现方案,那么下面来探讨一下js里是否有多继承,如何实现多继承.在这里可以看看j ...

  8. javascript继承(五)—prototype最优两种继承(空函数和循环拷贝)

    一.利用空函数实现继承 参考了文章javascript继承—prototype属性介绍(2) 中叶小钗的评论,对这篇文章中的方案二利用一个空函数进行修改,可以解决创建子类对象时,父类实例化的过程中特权 ...

  9. javascript继承(四)—prototype属性介绍

    js里每一个function都有一个prototype属性,而每一个实例都有constructor属性,并且每一个function的prototype都有一个constructor属性,这个属性会指向 ...

  10. 【JavaScript】重温Javascript继承机制

    上段时间,团队内部有过好几次给力的分享,这里对西风师傅分享的继承机制稍作整理一下,适当加了些口语化的描述,留作备案. 一.讲个故事吧 澄清在先,Java和Javascript是雷锋和雷峰塔的关系.Ja ...

随机推荐

  1. SpringBoot + Spring Security 学习笔记(一)自定义基本使用及个性化登录配置

    官方文档参考,5.1.2 中文参考文档,4.1 中文参考文档,4.1 官方文档中文翻译与源码解读 SpringSecurity 核心功能: 认证(你是谁) 授权(你能干什么) 攻击防护(防止伪造身份) ...

  2. Spring Boot使用Spring Data Jpa对MySQL数据库进行CRUD操作

    只需两步!Eclipse+Maven快速构建第一个Spring Boot项目 构建了第一个Spring Boot项目. Spring Boot连接MySQL数据库 连接了MySQL数据库. 本文在之前 ...

  3. JMeter主要组件介绍

    JMeter主要组件介绍   转自https://www.cnblogs.com/linbo3168/p/6023962.html 作者:linbo.yang 1.测试计划(Test Plan)是使用 ...

  4. 使用Aspose.Words将Word文档转换为Tiff格式图片文件

    用Aspose组件的优点是操作Word文档不需要安装Office就可以实现. 首先需要引用Aspose.Words.dll,链接地址:链接:https://pan.baidu.com/s/1rJvjp ...

  5. c# 构造tree下拉框,空格转化

    c#代码写的空格如何在html中的select中展示出来呢? var str = ""; //父级菜单不缩进 ; j < i; j++) { str += HttpUtili ...

  6. mysql存储过程 带参数 插入 操作

    今天再次添补一下小小内容,闲话不多说,直入标题. 先来看下,如何创建带参数的 存储过程(ps:本文只限mysql5及以上版本) CREATE PROCEDURE prSaveFileInfo(Tabl ...

  7. 20190421-那些年使用过的CSS预处理器(CSS Preprocessor)之Sass and Less

    写在前面乱七八糟的前言: emmm,还是决定把Sass与Less单独出来写成一篇,可能会稍微好辣么一丢丢?TAT语法特性是真的香,通篇下来能吸收个10%自我感觉已经很nice了,毕竟渣渣的我有渣渣的自 ...

  8. MongoDB学习(查找文档和其他数据查找操作)

    理解Cursor对象和查询运算符 cursor对象 cursor对象相当于一个指针,可通过迭代它来访问MongdoDB数据库中的一组对象. 在使用 find() 方法查询时,返回的并非实际文档,而是一 ...

  9. Snapde和Excel、PowerPivot、WPS打开超大CSV文件性能比较

    Snapde,一个专门为编辑超大型数据量CSV文件而设计的单机版电子表格软件:它运行的速度非常快,反应非常灵敏. 我们拿四份文件进行测试,对比一下他们打开大文件的性能:loan_theme_ids.c ...

  10. Android Studio教程06-布局,监听器以及基本控件

    目录 2. 监听器 3. 布局 3.1. 布局分类 (1). Linear Layout (2). Relative Layout (3). ListView (4). Grid View 4. 其他 ...