1. 面向对象
a) 单例模式（单体模式）
let name = 'Datura';
let age = 18;
let person = {
name,
age,
sex:'Man',
showName:function(){return this.name},
showAge:function(){return this.age}
};
alert(person.showAge()); //18
alert(person.sex); //Man
b) 工厂模式
es5的面向对象工厂模式：
首先让我们一起来回一下es5面向对象的写法：
i) 首先定义一个构造函数（此处是 Person）；
ii) 定义Person的“属性”，用this.xxx = xxx；
iii) 把方法挂在原型上，Person.prototype.xxx = function(){ xxx }；
iiii) 调用
function Person(name,age){
this.name = name;
this.age = age;
}
Person.prototype.showName = function(){
return this.name;
};
Person.prototype.showAge = function(){
return this.age;
};
var p1 = new Person('alice',18);
alert(p1.showAge()); //18
es5继承：
//定义一个Person构造函数
function Person(name,age){
this.name = name;
this.age = age;
}
Person.prototype.showName = function(){
return this.name;
};
Person.prototype.showAge = function(){
return this.age;
};
//Worker构造函数
//继承属性
function Worker(name,age,job){
//改变this指向，继承Person的属性
Person.apply(this,arguments);
//定义worker新的属性
this.job = job;
}
//继承方法
Worker.prototype = new Person();
//给worker指定“亲爹”
Worker.prototype.construcotr = Worker;
//定义worker新的方法
Worker.prototype.showJob = function(){
return this.job;
};
//调用
var p2 = new Worker('Datura',20,'boss');
alert(p2.showName()); //Datura
alert(p2.showJob()); //boss
es6的面向对象工厂模式：
i) 首先定义一个构造函数（此处是 Person），注意用class关键字而不是function；
ii) 定义Person的“属性”，写在constructor(){this.xxx = xxx }；
iii) 定义方法，xxx () { xxx }；
iiii) 调用
iiiii) 注意constructor和方法之间没有“;”，可以给属性初始值或默认值
class Person{
constructor(name,age=25){ //可以给属性初始值或默认值,正常es的function函数也可以给默认值
this.name = name;
this.age = age;
}
showName(){
return this.name;
}
showAge(){
return this.age;
}
}
var p1 = new Person('alice',18);
alert(p1.showAge()); // 18
es6继承：
//父类构造函数Person
class Person{
constructor(name,age){
this.name = name;
this.age = age;
}
showName(){
return this.name;
}
showAge(){
return this.age;
}
}
//子类继承父类
class Worker extends Person{
constructor(name,age,job='搬砖的'){ //继承父类属性，并新加属性给默认值
super(name,age);
//这里必须传参，也就是需要把原来构造函数的参数传入。
//子类必须在constructor方法中调用super方法，否则新建实例时会报错。
//这是因为子类没有自己的this对象，而是继承父类的this对象，然后对其进行加工。如果不调用super方法，子类就得不到this对象。
this.job = job;
}
//给子类定义新方法showJob
showJob(){
return this.job;
}
}
//调用
var w1 = new Worker('rose',17);
alert(w1.showJob());
alert(w1.showName());
2. 模块化
注意：目前还没有浏览器支持模块化(需要引入traceur.js和bootstrap.js)
第三方：seajs require.js 模块化工具
那么我们来学习下,es6自带的模块化
a).导出，将变量a“暴露”出去
const a =12;
export default a;
b).导入1.js文件“暴露”的东西，并用modA 接收
import modA from './1.js'; (./代表同级目录下)
c).同一个模块导出多个值 export default {a:12,b:5};
d).不同模块间的引入
import modA from './mod1.js';
import modB from './mod2.js';
let sum = modA+modB;
export default sum;
实例写个小例子：
//mod1.js文件的内容
const a = 12;
export default a;
//mod2.js文件的内容
const b = 5;
export default c;
//主入口（模块）的内容
<script src="traceur.js"></script>
<script src="bootstrap.js"></script>
<script type="module">
import modA from './mod1.js';
import modB from './mod2.js';
alert(modA+modB); //17
</script>
一个子模块“暴露”一个json数据
//mod3.js文件的内容
export default {a:12,b:5};
//主入口（模块）的内容
import modA from './mod3.js';
console.log(modA.a+modA.b); // 17
