es6中class类的使用

在es5中我们是使用构造函数实例化出来一个对象,那么构造函数与普通的函数有什么区别呢?其实没有区别,无非就是函数名称用首字母大写来加以区分,这个不用对说对es5有了解的朋友都应该知道。

但是es5的这种方式给人的感觉还是不够严谨,于是在es6中就换成了class,就是把es5中的function换成了class,有这个单词就代表是个构造函数,然后呢对象还是new出来的,这一点并没有变化。

   类的使用

从里面的代码我们可以看到除了function变成了class以外,其它的跟es5一样

class Coder{
    name(val){
        console.log(val);
    }
}

let shuang= new Coder;
shuang.name(‘shuang‘);

  类的传参

在es6中的对象的属性都是写在constructor里面,方法都是在原型身上。在这里面的代码用constructor约定了两个参数,然后用add()方法把参数相加,这个地方跟以前不太一样,所以需要多注意一下。

class Coder{
    name(val){
        console.log(val);
        return val;
    }

    constructor(a,b){
        this.a=a;
        this.b=b;
    }

    add(){
        return this.a+this.b;
    }
}

let shuang=new Coder(1,2);
console.log(shuang.add());

 class的继承

class的继承就是用extends

class shuang extends Coder{

}

let shuang=new shuang;
shuang.name(‘Angel爽‘);

声明一个shuang的新类,用extends继承了Coder,调用里面的name方法,发现也是可以输出的。

时间: 2024-10-08 07:58:24

es6中class类的使用的相关文章

ES6中的类

前面的话 大多数面向对象的编程语言都支持类和类继承的特性,而JS却不支持这些特性,只能通过其他方法定义并关联多个相似的对象,这种状态一直延续到了ES5.由于类似的库层出不穷,最终还是在ECMAScript 6中引入了类的特性.本文将详细介绍ES6中的类 ES5近似结构 在ES5中没有类的概念,最相近的思路是创建一个自定义类型:首先创建一个构造函数,然后定义另一个方法并赋值给构造函数的原型 function PersonType(name) { this.name = name; } Person

重学ES6(二):ES5和ES6中Class类的相同与不同

ES5和ES6中Class类的相同与不同 先说结论,简而言之ES5用function定义类,ES6用class定义类,class的本质是function,ES6中的类只是语法糖,它并没有改变ES5下类实现的本质. 类的定义 ES5 // ES5函数来描写类 // 声明类 let Animal = function (type) { this.type = type // 定义实例方法 this.drink = function () { console.log('drink') } } // 定

ES6中class类用法

之前想要通过javascript来实现类,通常会采用如下构造函数的模式: 1 function Person(name,age,job){ 2 this.name = name; 3 this.age = age; 4 this.job = job; 5 this.friends = ['Shelby','Court']; 6 } 7 Person.prototype = { 8 constructor:Person, 9 sayName: function(){ 10 document.wri

es6中class类的全方面理解(二)------继承

继承是面向对象中一个比较核心的概念.ES6 class的继承与java的继承大同小异,如果学过java的小伙伴应该很容易理解,都是通过extends关键字继承.相较于ES5当中通过原型链继承要清晰和方便许多.先上代码: class Cucurbit{ constructor(name,color){ console.log("farther") this.name=name; this.color=color; } say(){ console.log("我的名字叫"

JavaScript、ES6中的类和对象

面向对象可以用于描述现实世界的事物,但是事物分为具体的(特指的)事物和抽象的(泛指的)事物. 面向对象思维的特点: 1.抽取(抽象)对象共有的属性和行为组织(封装)成一个类(模板) 2.对类进行实例化,获取类和对象 3.对象--特指的 1) 对象是一个具体的事物,一个苹果.一张网页.一个数据库.一个与远程服务器的连接也是对象: 2) javascript中 对象是一组无序的相关属性和方法的集合,所有的事物都是对象,例如,字符串.数值.数组.函数等. 属性:事物的特征,在对象中用属性来表示(常用名

深入ES6中的class类

今天在学习vuex时,遇到了定义store类时的一种写法,就是在类中的方法使用箭头函数绑定this的问题时的一种操作,感觉写法有点陌生,遂深究一番,好了上代码 此处写commit中的地方,是为了绑定this指向Store类的实例对象,所以使用了箭头函数,当然也可以使用bind进行绑定,今天就来说说ES6中class类的实质 第一.首先要明白,ES6的class只是一个语法糖,class写法只是让对象原型的写法更加清晰.更像面向对象编程的语法而已,其实还是使用ES5的构造函数来实现的. 如下是ES

ES6中Arguments和Parameters用法解析

原文链接 译文 ECMAScript 6 (也称 ECMAScript 2015) 是ECMAScript 标准的最新版本,显著地完善了JS中参数的处理方式.除了其它新特性外,我们还可以使用rest参数.默认值.解构赋值等. 本教程中,我们将详细探索arguments和parameters,看看ES6是如果改善升级它们的. 对比 Arguments 和 Parameters 通常情况下提到 Arguments 和 Parameters, 都认为是可以互换使用的.然而,基于本教程的目的,我们做了明

ES6中的Symbol类型

前面的话 ES5中包含5种原始类型:字符串.数字.布尔值.null和undefined.ES6引入了第6种原始类型--Symbol ES5的对象属性名都是字符串,很容易造成属性名冲突.比如,使用了一个他人提供的对象,想为这个对象添加新的方法,新方法的名字就有可能与现有方法产生冲突.如果有一种机制,保证每个属性的名字都是独一无二的,这样就从根本上防止了属性名冲突.这就是ES6引入Symbol的原因,本文将详细介绍ES6中的Symbol类型 创建 Symbol 值通过Symbol函数生成.这就是说,

使对象具有ES6中Iterator接口的实现方法

es6中只有具有iterator接口的数组或者类数组(arguments)都可以使用for of来循环,但是对于对象来说不行,可以利用迭代器中的原理来给对象生成一个迭代器,实现让对象可以使用for of 1 var j={ 2 name:'小红', 3 age:18 4 } 5 //给j对象添加一个iterator接口 6 j[Symbol.iterator]=function(){ 7 //使用object.keys()方法把j对象中的k值读取出来存在数组当中 8 var arr=Object