5 ES6 class类、ES7class类

1、面向过程&面向对象:

(1).面向过程编程思想:其聚焦点把功能拆分成步骤,一环扣一环的完成,但是需求复杂到一定程度后,实现难度“陡增”,对开发者能力的挑战也越来越强;

(2).面向对象编程思想:其前期把功能拆分并抽象成不同的对象,聚焦点是对象实现的功能以及它们之间的配合,大型项目的构建相对于面向过程开发更加轻松些; -> 面向对象语言要比面向过程语言学习难度大,例如java,前期学习就需要具备较强的“逻辑抽象”能力;

- - - >>> javaScript:弱类型,解释性,多范式的编程语言,其不是完全的“面向对象”语言,而是“基于对象”的语言,js中基本上一切皆对象;[面向对象的编程语言需具备封装、继承、多态,js比较弱化这些概念]

- - ->>> 前端开发需要面向对象的思想:例如封装模块,实现代码复用,从而降低项目开发的复杂度;组件化开发;目前主流框架Vue React都采取面向对象的方式来实现;

- - - >>> ES6 class类便是“更好的面向对象”



2、ES6 class类 -> class、constructor、static、extends、super;//语法糖

(1).console.log(typeof Plane);//'function' ->验证了class类底层实现便是“构造函数”;

(2).class类主要是实现继承相比于ES5原型链继承写一大堆代码更加便捷了,ES5中私有属性继承采取的是“借用构造函数”,原型继承采取“圣杯模式”最佳,class类使用extends、super即可实现继承;

(3).class类与ES5的区别:Plane必须使用new+函数执行,Plane();//报错;Plane.prototype不能枚举;其新增静态属性;

3、ES7class类 -> static property = xxx;静态属性;aa = xxx;私有属性; @decorator 装饰器;//以上皆为提案属性,表示即使是最高版本浏览器也不兼容,需要下载插件配合babel转换器使用;

(1).浏览器不支持,需安装插件:npm install @babel/plugin-proposal-decorators

(2).ES7支持私有属性定义(省略了this.xxx = xxx;),原型属性依旧只有“方法”形式的;

(3). @decorator 装饰器 -> 其就是函数,装饰类、私有属性、原型属性,聚焦点:装饰它们的属性为“可读、可写、可枚举、可配置”等,参数较复杂(使用过程中可console.log(););

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • class的基本用法 概述 JavaScript语言的传统方法是通过构造函数,定义并生成新对象。下面是一个例子: ...
    呼呼哥阅读 4,207评论 3 11
  • 第3章 基本概念 3.1 语法 3.2 关键字和保留字 3.3 变量 3.4 数据类型 5种简单数据类型:Unde...
    RickCole阅读 5,530评论 0 21
  • Class 的基本语法 简介 JavaScript 语言中,生成实例对象的传统方法是通过构造函数。下面是一个例子。...
    huilegezai阅读 617评论 0 0
  • 简介 JavaScript语言中,生成实例对象的传统方法是通过构造函数。 ES6引入了Class(类)这个概念,作...
    oWSQo阅读 446评论 0 0
  • 简介 JavaScript 语言中,生成实例对象的传统方法是通过构造函数。下面是一个例子。 上面这种写法跟传统的面...
    lhdoeo阅读 551评论 0 1

友情链接更多精彩内容