js的class基础
2020-01-05 00:11
1351 查看
基本写法
let log = console.log; class people { constructor(name, age) { this.name = name; this.age = age; } } let aa = new people('张三', '22'); log(aa);
- 类的数据类型是函数
- 类本身就是指向构造函数的
- 类的方法之前不需要逗号分隔
- 类中所有的方法都是不可枚举的
constructor
- 每个类都会有一个constructor方法,该方法属于构造方法。
- 在new这个对象的时候会执行该方法
- 该构造方法默认返回实例对象(this)
class表达式
let log = console.log; let PeopleClass= class people { getName(){ return people.name; } } let aa = new PeopleClass(); log(aa.getName());
- 此处的class类名是people,而不是PeopleClass
- 如果内部没有用到类名,也可以省略类名
类的getter和setter
let log = console.log; class people { get name() { log("小明"); } set name(res) { log("设置名字叫:" + res); } } let aa = new people(); aa.name = 123; aa.name;
class的静态方法和静态属性
- 静态属性就是不会被实例继承的属性,同理,还会有一种叫实例属性
- 目前es6只有静态方法,没有静态属性
let log = console.log; class people { static sayName() { log("小明"); } sayAge(){ log("22") } } let aa = new people(); log(aa); aa.sayAge() people.sayName();
new.target属性
- 该属性用来获取当前构造函数是通过什么方式调用的
- 子类继承父类时,调用子类的构造函数时,在父类中的new.target属性会返回子类的类名
let log = console.log; class people { constructor() { log(new.target) log(new.target === people) } } class Speople extends people { constructor() { super() } } let aa = new Speople(); let bb = new people();
- 利用此特点,可以写出只能用new命令调用的class
- 还可以写出不能独立使用,必须要被继承才能用的class,反之同理。
相关文章推荐
- JS基础篇--HTML DOM classList 属性
- js——class基础
- WEB基础之innerHTML添加标签后class触发js的问题
- Vue.js基础学习之class与样式绑定
- JS基础篇--如何用JavaScript判断dom是否有存在某class的值?
- JS:js基础【一】
- 浅谈 Node.JS (一 基础知识)
- js函数基础回顾
- js基础2
- JS 基础面试题 2019年最新前端面试题目
- javascript基础(十)JS事件(下)
- 二、JavaScript语言--JS基础--JavaScript进阶篇--函数
- JS基础12-DOM访问列表框、下拉菜单的常用属性
- js 程序设计基础2
- 第 1 章 JS 基础语法
- node.js基础
- vue2.0+基础知识连载(05)--- 绑定class样式
- js基础--javascript基础概念之函数
- JavaScript基础----27JS内置对象-String字符串对象
- 浅谈js基础数据类型和引用类型,深浅拷贝问题,以及内存分配问题