一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第9天，点击查看活动详情。
（一） Proxy 代理
谷歌,QQ支持，360，搜狗不支持
//-----------------例1-------------------
let obj = {
webName: "源库网",
url:"www.yuanku.com"
}
let p = new Proxy(obj, {
get: function (target, key) {
return target[key]
},
set: function (target, key, value) {
target[key]=value
}
});
p.webName='yuankuwang';
console.log(p.webName);
//---------例2---------------------------
Proxy实际上重载（overload）了点运算符
var proxy = new Proxy(target, handler);
class Register{
//name='aaa';
constructor(){
this.prefix='';
this.name='';
console.log('构造完成');
}
}
let an = new Register();
let p = new Proxy(an, { //an或obj
get: function (target, key) {
return target[key];
},
set: function (target, key, value) {
if(key=='id'>>value==15){
target['prefix']='此人是逃犯';
}
target[key]=value;
if(key=='name'){
value= target[key]+','+target['prefix'];
}
return Reflect.set(target, key, value);
}
});
p.id=1;
p.name='张三';
console.log(p.name);
p.id=15;
p.name='李四';
console.log(p.name);
//-----------------------------------------------
Proxy对象方法列表:
方法 描述
handler.apply() 拦截Proxy实例作为函数调用的操作。
handler.construct() 拦截Proxy实例作为构造函数调用的操作。
handler.defineProperty() 拦截Object.defineProperty操作。
handler.deleteProperty() 拦截delete删除属性操作。
handler.enumerate() 此方法将被废弃，不建议使用。
handler.get() 拦截属性的读取操作。
handler.getOwnPropertyDescriptor() 拦截Object.getOwnPropertyDescriptor()操作。
handler.getPrototypeOf() 拦截获取原型对象操作。
handler.has() 拦截属性检索操作。
handler.isExtensible() 拦截Object.isExtensible()操作。
handler.ownKeys() 拦截Object.getOwnPropertyNames()操作。
handler.preventExtensions() 拦截Object.preventExtensions()操作。
handler.set() 拦截属性赋值操作。
handler.setPrototypeOf() 拦截Object.setPrototypeOf()操作。
Proxy.revocable() 创建一个可取消的Proxy实例。
****（二） M odel模块/import/export
所谓的模块就是一个独立的文件，文件与文件之间是相互封闭的。
//--------modeltest.js------------
export var webName = "源库网";
export let url = "www.yuanku.com";
export const year = 2016;
// export {
// webName as web,
// url as webUrl,
// year as webYear
// }
export function add(a,b){
return a+b;
}
export default class User{
constructor(){
console.log('user被创建了');
}
}
//-----------Hello.vue----------------------
//import User,{webName, url, year,add} from '../models/modeltest.js';
//import User,* as uu from '../models/modeltest.js';
//var mt = require('../models/modeltest.js');
import Student,* as uu from '../models/modelChild.js';
console.log('webName:'+uu.webName);
console.log('add:'+uu.add(9,12));
var user = new uu.User(); //继承中如果有default前缀,降无法访问
var student = new Student();
// console.log(mt.webName);
// console.log(mt.url);
// console.log(mt.age);
// console.log(mt.add(3,4));
//------------modelChild.js(继承)---------------------
export {webName, url, year,add,User} from './modeltest.js'; //User类的default必须去掉，否则无法访问
export default class Student{
constructor(){
console.log('Student被创建了');
}
}
------------------require和import差别-------------------------
require相当于module.exports的传送门，module.exports后面的内容是什么，require的结果就是什么，对象、数字、字符串、函数……再把require的结果赋值给某个变量，相当于把require和module.exports进行平行空间的位置重叠。
而且require理论上可以运用在代码的任何地方，甚至不需要赋值给某个变量之后再使用，比如：
require('./a')(); // a模块是一个函数，立即执行a模块函数
var data = require('./a').data; // a模块导出的是一个对象
var a = require('./a')[0]; // a模块导出的是一个数组
在使用时，完全可以忽略模块化这个概念来使用require，仅仅把它当做一个node内置的全局函数，它的参数甚至可以是表达式：
require(process.cwd() + '/a');
但是import则不同，它是编译时的（require是运行时的），它必须放在文件开头，而且使用格式也是确定的，不容置疑。它不会将整个模块运行后赋值给某个变量，而是只选择import的接口进行编译，这样在性能上比require好很多。
从理解上，require是赋值过程，import是解构过程
ES7很快也会发布，js引擎们会尽快实现ES6标准的规定，如果一个引擎连标准都实现不了，就会被淘汰， ES6是迟早的事 。如果你现在仍然在代码中部署require，那么等到ES6被引擎支持时，你必须升级你的代码，而如果现在开始部署import，那么未来可能只需要做很少的改动。
