es5创建对象和es6的Class

原创 2018年04月16日 17:31:06

es5创建对象的方式  有工厂模式,构造函数模式,原型模式和  组合使用构造函数模式+原型模式

最常使用的模式是 组合使用 构造函数模式+原型模式,这样的好处是,每个实例可以保持独特的实例属性,也可以共有原型方法

function Person(name,age){
  this.name=name;
  this.age=age;
}

Person.prototype.sayName=function(){
  return this.name+this.age;
}

var person1=new Person('zhm',25);

在es5中我们创建对象最好的方法就是 组合构造函数模式和原型模式

而es6帮我们封装了这种模式

class Person{
  construnctor(name,age){
    this.name=name;
    this.age=age;
  }

  sayName(){
    return this.name+this.age;
  }
}

var student=new Student('zhm',18);

Class类中的constructor方法就相当于es5中的构造函数,其实类中的所有方法都定义在了prototype上,prototype对象的constructor属性也指向class类本身,被所有实例共享

不同的是,Class只能通过new操作符调用,不能像es5中的构造函数一样,当成普通函数调用。

Class的写法就是一种语法糖,这些功能es5都能实现,只不过使用class可以让对象原型更加清晰,更接近面向对象编程。

constructor()方法是类的默认方法,所有的类都有constructor方法,如果constructor方法没有被显式定义,js会自动添加一个空的

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/zhm0303/article/details/79963204

es6中"类"--class的方式创建对象和es5中正常用法比较

JavaScript语言的传统方法是通过构造函数,定义并生成新对象。下面是一个例子。(可以是工厂模式,构造函数模式,组合模式优缺点自己可以在网上查找) function Point(x,y){ thi...
  • tangzhl
  • tangzhl
  • 2017-05-03 15:48:15
  • 1723

ES6 class与ES5 function区别及联系

关于构造器constructor在function定义的构造函数中,其prototype.constructor属性指向构造器自身 在class定义的类中,constructor其实也相当于定义在p...
  • u012657197
  • u012657197
  • 2017-08-24 21:37:58
  • 716

小记ES5和ES6的类

ES6中的类只是语法糖,它并没有改变类实现的本质。举个例子,在ES5中定义一个类:function Person(name) { this.name = name; }Person.prot...
  • fen747042796
  • fen747042796
  • 2017-03-29 16:20:30
  • 1805

ES5与ES6继承的区别

ES5的继承实质上是先创建子类的实例对象,然后再将父类的方法添加到this上(Parent.apply(this)). ES6的继承机制完全不同,实质上是先创建父类的实例对象this(所以必须先调用父...
  • shuidinaozhongyan
  • shuidinaozhongyan
  • 2017-05-11 16:47:33
  • 1866

关于ES5中的prototype与ES6中class继承的比较

ES5: 继承: 1.通过原型链实现继承。子类的prototype为父类对象的一个实例,因此子类的原型对象包含指向父类的原型对象的指针,父类的实例属性成为子类原型属性 2.ES5 的继承,实质是先创造...
  • mym940725
  • mym940725
  • 2017-12-20 16:26:30
  • 87

es6和es5中的this指向

先看一段代码: var name = "window"; var obj = { name: 'obj', //普通函数 one: function(){ ...
  • qq_38563845
  • qq_38563845
  • 2017-09-30 23:10:25
  • 277

ES5和ES6中对于继承的实现方法

在ES5继承的实现非常有趣的,由于没有传统面向对象类的概念,Javascript利用原型链的特性来实现继承,这其中有很多的属性指向和需要注意的地方。 原型链的特点和实现已经在之前的一篇整理说过了,就...
  • heyue_99
  • heyue_99
  • 2017-02-08 23:08:09
  • 2703

【ES6学习】— (5)异步编程async函数简介

之前学习了异步编程相关的Generator函数和Promise对象。ES7(目前处于提案阶段)中提供了更加方便的async来实现异步编程。本篇主要对async的相关知识点进行简单介绍。JavaScri...
  • Ahri_J
  • Ahri_J
  • 2016-11-01 10:37:23
  • 666

react的ES5与ES6写法的不同(一)

最近在学习react的编程写法,原本一直在用ES5的老版写法,近期接触了ES6的写法,想同大家一起分享一下两者的不同之处: 一、引入方式的不同: ES5的写法:var React = require(...
  • zhangrui_web
  • zhangrui_web
  • 2016-10-24 15:10:50
  • 1493
收藏助手
不良信息举报
您举报文章:es5创建对象和es6的Class
举报原因:
原因补充:

(最多只允许输入30个字)