让简短单行函数更容易编写和阅读的
普通函数可以是函数声明或函数表达式，但是箭头函数始终是表达式
普通函数(把名字转换为大写)
const upperNames = ['Fish', 'RedHands', 'Sugarbeans'].map(function(name) {
return name.toUpperCase();
});将函数转换为箭头函数,函数主体只有一个表达式,简写主体语法
1)删掉关键字 function
2)删掉圆括号
3)删掉左右花括号
4)删掉关键字 return
5)删掉分号
6)在参数列表和函数主体之间添加一个箭头（=>）
const upperNames = ['Fish', 'RedHands', 'Sugarbeans'].map( name => name.toUpperCase() );箭头函数的主体内需要多行代码,常规主体语法
1)它将函数主体放在花括号内
2)有返回内容也需要使用 return。
多个或者0个参数就需要将参数列表放在()中
有时候''_"表示一个参数,但是不使用它
const greet = name=>`Hello ${name}`;
greet("fish");
const students = (name,age) =>`Hello My name is ${name}, I'm ${age}`;
students("fish",19);
const firstDemo = _=>`Hello world!`; //参数为"_"箭头函数内的，this 的值与函数外面的 this 的值一样
function IceCream() {
this.scoops = 0;
}
IceCream.prototype.addScoop = function() {
const cone = this; // 设置 `this` 给 `cone`变量 ,如果使用箭头函数就不需要
setTimeout(function() {
cone.scoops++; // 引用`cone`变量
console.log('scoop added!');
}, 500);
};
const dessert = new IceCream();
dessert.addScoop(); //500毫秒之后,dessert.scoops = 1上面的闭包代码用箭头函数就可以不需要变量cone
function IceCream() {
this.scoops = 0;
}
// 为 IceCream 添加 addScoop 方法
IceCream.prototype.addScoop = function() {
setTimeout(() => {
this.scoops++; //直接使用函数外的对象
console.log('scoop added!');
}, 500);
};function getName(name){
name = (typeof name !== 'undefined') ? name : 'fish';
return name;
}
function getName(name = "fish") { // 添加等号 ( = ) 以及默认值
return name;
}// = [] 防止调用无参函数报错 Cannot read property 'Symbol(Symbol.iterator)' of undefined
function createGrid([width = 5, height = 5] = []) { //=[], createGrid()可以直接使用
return `Generating a grid of ${width} by ${height}`;
}函数可以让对象成为一个默认参数，并使用对象解构
与数组默认值相比,因为数组是基于位置的,对象默认值具备的一个优势是跳过参数进行处理
而数组是基于位置的,需要传入 undefined 以跳过参数
//={} 同数组一样
function createSundae({scoops = 1, toppings = ['Hot Fudge']} = {}) {
const scoopText = scoops === 1 ? 'scoop' : 'scoops';
return `Your sundae has ${scoops} ${scoopText} with ${toppings.join(' and ')} toppings.`;
}ES5 构造函数创建“类”
function Plane(numEngines) { //Plane 函数是一个构造函数
this.numEngines = numEngines;
this.enginesActive = false;
}
// 由所有实例 "继承" 的方法
Plane.prototype.startEngines = function () {
console.log('starting engines...');
this.enginesActive = true;
};
const richardsPlane = new Plane(1); //使用new创建新的 Plane 对象
richardsPlane.startEngines();
const jamesPlane = new Plane(4);
jamesPlane.startEngines();新的 class 语法编写后的代码
class Plane { //
constructor(numEngines) {
this.numEngines = numEngines;
this.enginesActive = false;
}
startEngines() {
console.log('starting engines…');
this.enginesActive = true;
}
}
typeof Plane; // function 新语法定义的类也只是一种函数静态方法不会被实例继承，而是直接通过类来调用
三种调用方法,调用与实例无关
1)父类直接调用
2)子类继承父类后调用
3)子类通过super对象调用
class Foo {
static classMethod() {
return 'hello';
}
}
Foo.classMethod(); //hello 父类直接调用
class Bar extends Foo {
}
Bar.classMethod(); //hello 子类继承父类调用
class Cla extends Foo {
return super.classMethod(); //hello super调用
}子类继承父类使用关键字 extends
在构造方法中，super 被用作函数,如果子类的构造方法中有this和super,super必须放在this的前面使用。在子类的方法中，super 被用作对象,调用父类的方法
class Tree { // ES6 创建类,子类
constructor(size = '10', leaves = {spring: 'green', summer: 'green', fall: 'orange', winter: null}) {
this.size = size;
this.leaves = leaves;
this.leafColor = null;
}
changeSeason(season) {
this.leafColor = this.leaves[season];
if (season === 'spring') {
this.size += 1;
}
}
}
class Maple extends Tree { //继承父类
constructor(syrupQty = 15, size, leaves) {
super(size, leaves); //构造方法中的super
this.syrupQty = syrupQty;
}
changeSeason(season) {
super.changeSeason(season); //子类方法中的super
if (season === 'spring') {
this.syrupQty += 1;
}
}
gatherSyrup() {
this.syrupQty -= 3;
}
}function Tree(size, leaves) { //ES5创建类,子类
this.size = size || 10;
this.leaves = leaves || {spring: 'green', summer: 'green', fall: 'orange', winter: null};
this.leafColor;
}
Tree.prototype.changeSeason = function(season) {
this.leafColor = this.leaves[season];
if (season === 'spring') {
this.size += 1;
}
}
function Maple (syrupQty, size, leaves) { //子类
Tree.call(this, size, leaves); //使用父类的属性
this.syrupQty = syrupQty || 15;
}
Maple.prototype = Object.create(Tree.prototype); //函数原型设置为基类原型
Maple.prototype.constructor = Maple;//重新建立constructor和构造函数的连接
Maple.prototype.changeSeason = function(season) {
Tree.prototype.changeSeason.call(this, season); //重写父类的方法
if (season === 'spring') {
this.syrupQty += 1;
}
}
Maple.prototype.gatherSyrup = function() {
this.syrupQty -= 3;
}Tree.call(this, size, leaves);
Maple.prototype = Object.create(Tree.prototype);
Maple.prototype.constructor = Maple;
另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。
