ES6 Class笔记

class:定义类的关键字

使用class定义类与使用函数定义类其实没有多大的差别。

只是使用class定义更清晰易懂。

constructor()方法:类的构造方法,通过new创建对象时会调用该方法。

该方法是类的默认方法,同时也是类必须的方法,

如果一个类没有显示的定义,一个空的constructor方法会被默认添加

class 定义类实例

class Person{

constructor(name = \‘es6\‘,age = 6,sex = \‘man\‘){

this.name = name;

this.age = age;

this.sex = sex;

}

logname(){

console.log(this.name);

}

logage(){

console.log(this.age);

}

logsex(){

console.log(this.sex);

}

}

let person = new Person();

person.logname();//es6

person.logage();//6

person.logsex();//man

extends:累的继承

class Man extends Person{

}

let man = new man();//在这里会报错

在子类中必须先调用父类的构造方法。

因为子类没有自己的this指向,必须先获取父类的this指向。

class Man extends Person{

constructor(){

super();

}

}

let man = new Man();

Extends 的继承目标

子类继承Object类。

这个时候子类其实是父类的复制。子类的对象其实就是Object的对象

class Meobject extends Object{

constructor(){

super();

}

}

let meobj = new Meobject();

let obj = new Object();

console.log(meobj instanceof Object);//true

console.log(obj instanceof Meobject);//false

getPrototypeOf()获取父类

console.log(Object.getPrototypeOf(meobj));//Object{}

super 关键字

1、当super当函数使用时,表示父类的构造方法

2、当super当对象调用方法时,表示父类的对象。同时会绑定子类的this对象

class Man extends Person{

constructor(){

super();

this.name = \‘php\‘;

super.logname();//php

}

}

let man = new Man();

静态属性和静态方法

静态属性:

通过直接定义在类上的属性是静态属性

静态方法

通过static关键字定义

静态属性与静态方法都无法继承

class Person{

constructor(name = \‘es6\‘,age = 6,sex = \‘man\‘){

this.name = name;

this.age = age;

this.sex = sex;

}

static maek(){

console.log(\‘make\‘);

}

}

Person.base = \‘base\‘;

class Man extends Person{

constructor(){

super();

}

}

let man = new Man();

console.log(man.base);//undefined

man.make();//man.make is not a function

时间: 2024-10-28 20:39:02

ES6 Class笔记的相关文章

es6学习笔记初步总结

es6学习笔记初步总结 1. let.const 和 block 作用域 在ES6以前,var关键字声明变量.无论声明在何处,都会被视为声明在函数的最顶部(不在函数内即在全局作用域的最顶部).这就是函数变量提升例如: let 关键词声明的变量不具备变量提升(hoisting)特性 let 和 const 声明只在最靠近的一个块中(花括号内)有效 当使用常量 const 声明时,请使用大写变量,如:CAPITAL_CASING const 在声明时必须被赋值 否则报语法错误SyntaxError

ES6学习笔记(二)——字符串扩展

相信很多人也和我一样,不喜欢这样循规蹈矩的逐条去学习语法,很枯燥乏味.主要是这样学完一遍之后,没过一段时间就忘到九霄云外了.不如实际用到的时候研究它记得牢靠,所以我就整理成笔记,加深记忆的同时便于复习查看. 在这样不断的学习过程中,也提高了自己的总结能力:) 1.字符串的遍历器接口 ES5,数组和对象可以进行遍历,使用for() 和 for...in,还有jq中的each()方法进行遍历. ES6为我们提供了字符串遍历器  for...of 循环遍历 优点:可以识别大于0xFFFF的码点,传统的

我的es6学习笔记

前两个月看了一套es6的教程,现在将当时我做的笔记分享出来,与大家一起分享,我的不足之初也希望大家可以指出来.虽然简单学过一遍,但是我项目中用到的也就const,let,解构赋值,默认参数,箭头函数,promiss,模板字符串差不多这几个吧,其他的还不是很了解.现在再拿出来结合阮一峰老师的书再重新的学习一遍. ES6 npm install babel-cli -g npm install babel-cli babel-preset-es2015 --save-dev babel es6.js

ES6阅读笔记

一.babel转换器:babel.js.io; 二.变量声明. 1.块级作用域let: 传统var声明:var a = []; for (var i = 0; i < 10; i++) { a[i] = function () { console.log(i); }; } a[6](); // 10 变量let声明: var a = []; for (let i = 0; i < 10; i++) { a[i] = function () { console.log(i); }; } a[6]

ES6学习笔记第三章

数组的解构赋值 基本用法 ES6允许按照一定的模式,从数组和对象中取值,对变量进行赋值,这被称之为解构(Destructuring). 以前,为变量赋值,只能直接指定值. var a = 1; var b = 2; var c = 3; 而ES6允许写成下面这样. var [a,b,c] = [1,2,3]; 这种写法属于"模式匹配",只要等号两边模式相同,左边的变量就会被赋值. 如果解构不成功,变量的值就等于undefined. var [foo] = [ ]; var [bar,

es6学习笔记4--数组

数组的扩展 Array.from() Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括ES6新增的数据结构Set和Map). let arrayLike = { '0': 'a', '1': 'b', '2': 'c', length: 3 }; // ES5的写法 var arr1 = [].slice.call(arrayLike); // ['a', 'b', 'c'] // ES6的写法 l

ES6学习笔记第二章

let 和 const命令 1 let命令 用法: ES6新增let命令,用于声明变量,用法类似var,只是let声明的变量是块级作用域内有效 例: { let a = 10; var b = 1; } a // a is not defined b // 1 根据返回值可以看出,let声明变量时的作用域只在其代码块内 for 循环的计数器就很适合使用let来声明变量. var a = []; for (var i = 0; i<10; i++){ a[i] = function(){ cons

ES6学习笔记(三)

ES6加强了对Unicode的支持,并且扩展了字符串对象. 1.字符的Unicode表示法 JavaScript允许采用\uxxxx形式表示一个字符,其中“xxxx”表示字符的码点. "\u0061" // "a" 但是,这种表示法只限于\u0000——\uFFFF之间的字符.超出这个范围的字符,必须用两个双字节的形式表达. "\uD842\uDFB7" // "??" "\u20BB7" // "

es6读书笔记(四)——顶层对象

ES6一方面规定,为了保持兼容性,var命令和function命令声明的全局变量,依旧是顶层对象的属性:另一方面规定,let命令.const命令.class命令声明的全局变量,不属于顶层对象的属性.也就是说,从ES6开始,全局变量将逐步与顶层对象的属性脱钩. var a = 1; // 如果在Node的REPL环境,可以写成global.a // 或者采用通用方法,写成this.a window.a // 1 let b = 1; window.b // undefined ES5之中,顶层对象