(一)箭头函数
1.单参数
function cheng0(a = 3) { return a * a; } let cheng = (a = 3) => a * a; console.log(cheng(9)); 复制代码
2.多参数
function add0(a, b) { return a + b; } let add = (a, b) => a + b; //默认返回值 console.log(add(3, 9)); 复制代码
3.无返回值
function jian0(a, b) { console.log(a + b); } let jian = (a, b) => { console.log(a - b) };//无返回值,用{}包裹 console.log(jian(3, 9)); 复制代码
4.多行,有其他表达式+return,用{}包裹
function chu0(a, b) { console.log(a + b); return a + b; } let chu = (a, b) => { console.log(a + b); return a + b; }; console.log(chu(3, 9)); 复制代码
2.如果箭头表达式仅仅就是简化了函数的命名,我们为什么要改变原来的习惯而去使用它呢?
箭头函数内部没有constructor方法,也没有prototype,所以不支持new操作。但是它对this的处理与一般的普通函数不一样。箭头函数的 this 始终指向函数定义时的this,而非执行时。
var o = { x : 1, func : function() { console.log(this.x) }, test : function() { setTimeout(function() { alert(this); //this指针转为全局window this.func(); }, 1000); } }; o.test(); // TypeError : this.func is not a function //----改为箭头函数 var o = { x : 1, func : function() { console.log(this.x) }, test : function() { setTimeout(() => { this.func() }, 100); } }; o.test(); //这回this就指向o了 复制代码
****(二)Class类
- 普通类:属性,构造方法,普通方法(无重载)
class Person { constructor(name, age, job) { this.name = name; this.age = age; this.job = job; this.friends = ['Shelby', 'Court']; } sayName() { console.log(this.name); } } let person = new Person('张三', 26, '司机'); person.sayName();//张三 复制代码
2.静态方法:
class Point { constructor(x, y) { this.x = x; this.y = y; } //静态方法 static distance(a, b) { const dx = a.x - b.x; const dy = a.y - b.y; return Math.sqrt(dx * dx + dy * dy); } } const p1 = new Point(5, 5); const p2 = new Point(10, 10); //取2点之间的距离: console.log(Point.distance(p1, p2)); //7.0710678118654755 复制代码
3.ES6明确规定,Class内部只有静态方法,没有静态属性,但可以用另外方式解决
class Foo { } Foo.prop = 1; Foo.prop // 1 //---单例模式 class Cache { constructor(id,name){ this.id = id; this.name = name; } static getInstance() { if(!Cache.instance) { Cache.instance = new Cache(); } return Cache.instance; } } var cache = Cache.getInstance(); cache.id = 1; cache.name = "wangdy"; console.log(cache)//Cache {id: 1, name: "wangdy"} 复制代码
4.继承:
class Animal { constructor(name) { this.name = name; } speak() { console.log(this.name + ' 叫了几声...'); } } //类继承(只有单继承) class Dog extends Animal { //方法的重写 speak() { console.log(this.name + ' barks.'); } } //可以直接使用父类的构造方法 let dog = new Dog('旺财'); dog.speak();//旺财 barks. //-------------------vue中loginbean的单例模式-------------------------- class LoginBean { static getInstance() { if (!LoginBean.instance) { LoginBean.instance = new LoginBean(); } return LoginBean.instance; } constructor() { this.id = 0; this.nicheng = null; } } var loginbean = LoginBean.getInstance(); export default loginbean;
作者:zhulin1028
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。