美文网首页
2018-07-16 JS中ES6 面向对象 与 ES5

2018-07-16 JS中ES6 面向对象 与 ES5

作者: Mo_ham_med | 来源:发表于2018-07-16 14:08 被阅读0次

JS中ES6对象与ES5对象的差别

ES6对象与ES5对象的差别

2018 7/16
晴-小雨 微风 温度 12-24°C

在es6中的面相对象与es5中的面向对象的区别是极大的,es6中的面相对象则更像原汁原味的后端语言像java,c++等,而且在es5中的class保留字,在es6中也成了实际有效的关键字。

我们来做个对比,

es5中创建一个对象需要用函数的形式去仿造后段语言中对象的形式去造对象:

function ren(name,age){

this.name=name;

this.age=age;

}

ren.prototype.aet = function(foot){

console.log(this.name+"aet"+foot);

}

var xiaoming = new ren("xiaoming",24);

xiaoming.aet("面包");

/这是es5中 主流创建对象的方法之一,方法写在原型链中/

而es6中造对象则更为直观与简便,

class ren{

//先创建构造函数

constructor(name,sex,age,id){

    this.name=name;

    this.sex=sex;

    this.age=age;

    this.id=id;

}

//ES6中的对象的方法不需要单独写在原型链中

 say(){

    console.log(this.name+"说话");

}

//ES6中多了静态方法的声明与使用,静态方法是实例对象无法调用的,是通过原型.方法名进行调用,

 静态方法 多数用于存储 公共方法,比如说要给 这一批 同类对象 进行排序等

static paixu(){

    console.log(this);

}

}

let ren1=new ren("小王","男",18,"10010");

//输出一下该对象

console.log(run1);

//调用ren1对象的say方法

ren1.say();

//调用原型中的排序方法,该方法在此处并没有实际作用

ren.paixu();

//ES6中的对象继承,与ES5不同,ES6中的继承 是与后端语言十分相像,

// 但是这里的继承 格式 是 class + 子类名 + extends + 基类 {};

class student extends ren{

//这里需要注意 构造函数的继承 需要 这样写

// constructor (参数){

super(基类参数);

***************

}

constructor(name,sex,age,id,sid){

super(name,sex,age,id);

this.sid=sid;

}

kaoshi(){

console.log(this.name+"考试");

}

let student1 = new student();

student1.name="xiaoming";

student.say();

console.log(studnet1);

}

相关文章

  • 承接上篇博文es6中的面向对象

    ES6对象与ES5对象的差别 晴-小雨 微风 温度 12-24°C 在es6中的面相对象与es5中的面向对象的区别...

  • 2018-07-16 JS中ES6 面向对象 与 ES5

    JS中ES6对象与ES5对象的差别 ES6对象与ES5对象的差别 2018 7/16晴-小雨 微风 温度 12-2...

  • ES6面向对象

    1、ES6面向对象: class(类) 构造函数 对象 实例对象 ES5面向对象是模拟面向对象。 2、继...

  • JavaScript | 理解对象属性和创建对象的方式

    JavaScript 的面向对象编程是比较难的部分,本文目前只针对es5来讲解js的对象,后续会在es6的语法基础...

  • 对JavaScript继承的理解

    本篇文章会分别从ES5和ES6的角度上来学习JS的继承。 由于js不像java那样是真正面向对象的语言,js是基于...

  • 2019-06-21

    JS中ES5和ES6中set和get方法 ES5 情况一:对象已经创建,需要给上面添加setget方法 情况二:当...

  • es6中的面向对象

    在es6中的面相对象与es5中的面向对象的区别是极大的,ea6中的面相对象则更像原汁原味的后端语言像java,c+...

  • es5与es6常用语法教程(4)

    js常用语法系列教程如下 es5与es6常用语法教程(1) es5与es6常用语法教程(2) es5与es6常用语...

  • es5与es6常用语法教程(2)

    js常用语法系列教程如下 es5与es6常用语法教程(1) es5与es6常用语法教程(2) es5与es6常用语...

  • es5与es6常用语法教程(3)

    js常用语法系列教程如下 es5与es6常用语法教程(1) es5与es6常用语法教程(2) es5与es6常用语...

网友评论

      本文标题:2018-07-16 JS中ES6 面向对象 与 ES5

      本文链接:https://www.haomeiwen.com/subject/vxcbpftx.html