前端最基础的就是HTML+CSS+Javascript。掌握这三项技术算是入门，但也只是入门而已。现在前端开发的定义远不止于此。前端小课堂（HTML/CSS/JS），本着提高技术水平，夯实基础知识的中心思想，开课（每周四）。前言BBECMAScript2015中引入的类（Class）实际上是基于原型继承的语法糖。不是新的面向对象的继承模型。其实我用的不多，写小活动也不需要。之前用来写小后台，ThinkJS内部使用的是Class形式。体验了一段时间，后来因为写起来不是很爽就放弃了，vue+TypeScript。我也体验过，Angular。Class可以理解为一个特殊的函数（必须是New.Declare提升，死区。严格模式下执行）declareclassPoint{constructor(x,y){this.x=x;这个.y=y;}}classCircle{constructor(point,r){this.point=point;这个.r=r;}}等同于函数Circle(point,r){this.point=point;this.r=r;}newCircle([50,50],10)构造函数Constructor创建一个对象时，它做了多少事情？初始化一个空对象并绑定this执行构造函数返回这个对象（不需要return返回）。因为类是可以继承的，所以可以使用super关键字来调用父类的构造函数。classCircle{constructor(point,r){//super()//调用父类的构造函数this.point=point;这个.r=r;}}原型链方法类Circle{constructor(point,r){this.point=point;这个.r=r;}//原型链方法，实例化后可以计算面积getarea(){console.log('getarea')returnthis.calcArea()}//原型链法，实例化后可以计算面积calcArea(){returnMath.PI*Math.pow(this.r,2)}}//newCircle([50,50],20)原型方法，静态方法，静态字段类Point{staticstaticField='staticfield';构造函数（x，y）{this.x=x;这个.y=y;}静态距离(a,b){constdx=a.x-b.x;constdy=a.y-b.y;返回Math.hypot(dx,dy);}}constp1=newPoint(5,5);constp2=newPoint(10,10);console.log(Point.distance(p1,p2));属性声明classPoint{x=0y=0constructor(x,y){if(x)this.x=x;如果（y）this.y=y；}}newPoint()内部属性声明类似于前面闭包类中的变量Rectangle{#height=0;＃宽度;构造函数（高度，宽度）{this.#height=height;这个。#width=宽度；console.log(this.#height)}}rect=newRectangle(1,2)//rect.#height继承如果子类中有构造函数，则需要调用super()classAnimal{name='Breaux';构造函数（名称）{this.name=名称；}speak(){console.log(this.name+'makesanoise.')beforeusingthis;}}classDogextendsAnimal{age=0;constructor(age){super('Mitzie')this.age=age;}speak(){console.log(this.name+'barks.'+`age:`+this.age);}}vard=newDog(10);d.speak();//'Mitziebarks.age:10'验证Newboost&deadzonestrictmode微信公众号：前端linong参考文献前端训练目录，前端训练计划，前端训练计划https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Classes/Class_elementshttps://developer.mozilla.org/zh-CN/文档/Web/JavaScript/Reference/Classeshttps://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Classes/extends
