连看4篇前辈的文章,记录一些知识点

  1. Javascript继承机制的设计思想

  2. Javascript 面向对象编程(一):封装

  3. Javascript面向对象编程(二):构造函数的继承

  4. Javascript面向对象编程(三):非构造函数的继承

1. constructor

在Javascript语言中,new命令后面跟的不是类,而是构造函数(constructor)。

创建一个叫Student的构造函数,表示学生对象的原型

function Student(name){
    this.name = name;
  }

顺便带一下js中this的用法
Javascript 的 this 用法

对这个构造函数使用new,会生成Student的实例

var st1 = new Student("lilei")
console.log(st1.name) // lilei

此时st1 会自动含有一个属性constructor,指向构造函数

console.log(st1.constructor == Student) //true

用构造函数生成实例对象(使用new),有一个缺点,那就是无法共享属性和方法

比如说有同学韩梅梅和同学李雷,他们共同在太阳班

function Student(name){
this.name = name;
this.class = "sun";
}
var st1 = new Student("lilei")
var st2 = new Student("hanmeimei")

输出二人的班级

console.log(st1.class)//sun
console.log(st2.class)//sun

班级改名,修改李雷的班级为月亮班

韩梅梅的班级名称没有发生变化,依然是sun(太阳班)

st1.class = "moon"
console.log(st1.class) //moon
console.log(st2.class) //sun

所以,构造函数中的共有属性无法做到数据共享,要做到数据共享,需要用到prototype

2. prototype

构造函数设置有prototype属性,属性中包含一个对象,需要共享的属性和方法,放在prototype对象里

。不需要共享的属性和方法,放在构造函数里

将上述例子改写

function Student(name){
this.name = name;
}
Student.prototype = {class : "sun"} var st1 = new Student("lilei")
var st2 = new Student("hanmeimei") st1.prototype.class = "moon"
console.log(st1.class) //moon
console.log(st2.class) //moon

每一个实例都有一个constructor属性,默认调用prototype的constructor属性

st1.constructor  = st1.prototype.constructor

总结:


constructor储存不需要共享的属性和方法,而prototype对象储存需要共享的属性和方法

js中prototype,constructor的理解的更多相关文章

  1. 【JavaScript】关于JS中的constructor与prototype

    最初对js中 object.constructor 的认识: 在学习JS的面向对象过程中,一直对constructor与prototype感到很迷惑,看了一些博客与书籍,觉得自己弄明白了,现在记录如下 ...

  2. 【推荐】关于JS中的constructor与prototype【转】

    最初对js中 object.constructor 的认识: 在学习JS的面向对象过程中,一直对constructor与prototype感到很迷惑,看了一些博客与书籍,觉得自己弄明白了,现在记录如下 ...

  3. js中prototype和constructor的认识

    最初对js中 object.constructor 的认识: 我们都知道,在JS中有一个function的东西.一般人们叫它函数.比如下面的代码 function Person(name)    {  ...

  4. js中关于constructor与prototype的理解

    1.①__proto__和constructor属性是对象所独有的:② prototype属性是函数所独有的,因为函数也是一种对象,所以函数也拥有__proto__和constructor属性. 2. ...

  5. 分析js中的constructor 和prototype

    在javascript的使用过程中,constructor 和prototype这两个概念是相当重要的,深入的理解这两个概念对理解js的一些核心概念非常的重要. 我们在定义函数的时候,函数定义的时候函 ...

  6. Js中Prototype、__proto__、Constructor、Object、Function关系介绍

    一. Prototype.__proto__与Object.Function关系介绍 Function.Object:都是Js自带的函数对象.prototype,每一个函数对象都有一个显式的proto ...

  7. 深入分析js中的constructor 和prototype

    在javascript的使用过程中,constructor 和prototype这两个概念是相当重要的,深入的理解这两个概念对理解js的一些核心概念非常的重要. 我们在定义函数的时候,函数定义的时候函 ...

  8. 【转】Js中Prototype、__proto__、Constructor、Object、Function关系介绍

    一    Prototype.__proto__与Object.Function关系介绍        Function.Object:Js自带的函数对象.         prototype,每一个 ...

  9. JS中的constructor与prototype

    http://www.cnblogs.com/qiantuwuliang/archive/2011/01/08/1930548.html 在学习JS的面向对象过程中,一直对constructor与pr ...

随机推荐

  1. 【多媒体封装格式详解】--- AAC ADTS格式分析

    ADTS全称是(Audio Data Transport Stream),是AAC的一种十分常见的传输格式. 记得第一次做demux的时候,把AAC音频的ES流从FLV封装格式中抽出来送给硬件解码器时 ...

  2. vue使用mockjs配置步骤(无需启动node服务)

    1.安装好mockjs命令行 npm install mockjs 2.在项目中引用mockjs [ 重要 ] ##在项目src目录下新建一个mock文件夹 ##在mock文件夹下新建 index.j ...

  3. linux 安装配置nexus以及maven私服应用

    ---------------------nexus---------------------- 1.编辑nexus脚本, 配置 RUN_AS_USER 参数vi /usr/local/src/nex ...

  4. 前端自动化构建工具webpack (一)之webpack安装 和 设置webpack.confi.js

    目的:  模块化开发,组件化开发,让代码符合开发规范,更高效 webpack作用:从pack,就知道这是包的意思,比较专业点叫做前端自动化打包构建工具,代码错误检查,预处理,文件合并(打包),代码压缩 ...

  5. C语言函数strstr

    函数原型: extern char *strstr(char *str1, const char *str2);   语法: * strstr(str1,str2)   参数: str1: 被查找目标 ...

  6. 用 ArrayList 集合调用商品类

    public class  Commodity{ //定义商品类 String name; //定义商品名字 double  size;  //定义商品尺寸 double  price; //定义商品 ...

  7. juqery 给本身的class加上一个class 或也可以实现关注商品,取消关注商品

    $("#goods1").on("click",".ICON-fen-LOVE",function(){ var $this = $(thi ...

  8. thinkphp 多图片上传 单图片上传

    不管是单图片上传还是多图片上传都必须要引用这两个js 下载地址 链接:http://pan.baidu.com/s/1eStkUt0 密码:asvo <script src="Publ ...

  9. python全栈开发 * 15知识点汇总 * 180621

    #15 函数二 与 匿名函数1.dir() # 查看内置属性,将对象所有方法名放在另一个列表中.dic={"水果":"香蕉",'蔬菜':"土豆&quo ...

  10. 如何将AAC音频转换成MP3格式

    我们应该怎样将AAC音频转换成MP3格式呢?AAC是一种专为声音数据设计的文件压缩格式,相对于MP3音频来说更加高效,性价比跟高.但是因为MP3音频格式的通用性,我们还是时常需要将AAC音频转换成MP ...