（一）Decorator修饰器
修饰器（Decorator）是一个函数，用来修改类的行为。这是ES7的一个提案，目前Babel转码器已经支持。
需要先安装一个插件：
npm install babel-plugin-transform-decorators-legacy --save-dev
然后在项目根目录下，找到：.babelrc=>修改为
"plugins": ["transform-runtime","transform-decorators-legacy"],
//添加属性，添加方法，在方法执行之前添加动作
1.给添加一个静态方法(属性)
function chooseCourse(target){ target.cours='物理'; } function classroom(target) { target.study=function(){ console.log(target.identity+'学习'); } } @chooseCourse @classroom class Student { } Student.study(); 复制代码
2.修饰器带参数
function chooseCourse(courseName){ return function(target){ target.courseName=courseName; } } function classroom(roomName){ return function(target){ target.study=function(){ console.log('在'+roomName+'学习'+target.courseName); } } } @chooseCourse('物理') @classroom('第1教室') class Student { } Student.study(); 复制代码
3.修饰器不仅可以修饰类，还可以修饰类的方法(属性)
function chooseCourse(courseName){ return function(target){ console.log('检查准考证:'+target.uid); //target中的this发生指针转移 target.courseName=courseName; } } class Student { constructor(){ this.uid=15; } @chooseCourse('物理') exam(){ console.log(this.uid+'考试,考:'+this.courseName); } } //Student.study(); let student = new Student(); //student.uid=15; student.exam(); 复制代码
4.修饰器只能用于类和类的方法，不能用于函数，会导致函数提升而发生错误
//---------错误------------------------- @chooseCourse('物理') function Teacher(){ teach(){ console.log('讲师教:'+this.courseName); } } Teacher.teach(); 复制代码
5.装饰模式与代理模式的差别
装饰器模式关注于在一个对象上动态的添加方法，然而代理模式关注于控制对对象的访问。换句话 说，用代理模式，代理类（proxy class）可以对它的客户隐藏一个对象的具体信息。因此，当使用代理模式的时候，我们常常在一个代理类中创建一个对象的实例。并且，当我们使用装饰器模 式的时候，我们通常的做法是将原始对象作为一个参数传给装饰者的构造器。
使用代理模式，代理和真实对象之间的的关系通常在编译时就已经确定了，而装饰者能够在运行时递归地被构造。
（二）二进制数组
es6中二进制数组包括：用
ArrayBuffer对象
TypedArray视图
DataView视图
ArrayBuffer对象代表原始的二进制数据，TypedArray视图用来读写简单类型的二进制数据，DataView视图用来读写复杂类型的二进制数据。
用来存储文件，流等数据的存储
以ArrayBuffer对象为例：
<input type='file' name='fileInput' id='fileInput' v-on:change='showImg'/> <img :src ="buffer"/> <script> function arrayBufferToBase64( buffer ) { var binary = ''; var bytes = new Uint8Array( buffer ); var len = bytes.byteLength; for (var i = 0; i < len; i++) { binary += String.fromCharCode( bytes[ i ] ); } return window.btoa( binary ); } var thisa; export default { name: 'hello', data () { studyEs6(); return { buffer:'data:image/png;base64,', msg: '欢迎 to Your Vue.js App', } }, created (){ thisa=this; }, methods: { showImg:function(){ //alert(thisa); var fileInput = document.getElementById('fileInput'); //alert(fileInput); var file = fileInput.files[0]; //alert(file); var reader = new FileReader(); //alert(reader); reader.readAsArrayBuffer(file); reader.onload = function () { var arrayBuffer = reader.result;//reader.result.toByteArray; //alert(thisa.msg); let arrayBase = arrayBufferToBase64(arrayBuffer); thisa.buffer='data:image/png;base64,'+arrayBase; }; } } } function studyEs6(){ } </script>
作者：zhulin1028
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
