es6引入了类Class 的概念,作为对象的模板。可以使用Class关键字定义类,通过类实例化对象。
Class类可以看做是一个语法糖,绝大部分功能也可以通过es5做到。
Class写法只是让对象原型的写法更加清晰、更像面向对象变成的语法而已。
ES5 构造函数实例化对象
// An highlighted block
function Phone(brand, price) {
this.brand = brand;
this.price = price;
}
Phone.prototype.call = function () {
console.log('call me');
};
let HW = new Phone('huawei', 9999);
console.log(HW);
构造方法 名称不能修改 实例化是自动执行
方法定义不能使用ES5对象的形式
class Phone {
// 构造方法 名称不能修改 实例化是自动执行
constructor(brand, price) {
this.brand = brand;
this.price = price;
}
// 不能使用ES5对象的形式
// call: function (){} // 错误
call() {
console.log('call me');
}
}
let OPPO = new Phone('oppo', 6666);
console.log(OPPO);
es5 函数对象与实例对象属性/方法不通,通过prototype链接
function Phone() {}
Phone.name = 'hw';
Phone.call = function () {
console.log('call me');
};
Phone.prototype.size = 10;
var hw = new Phone();
console.log(hw.name);
console.log(hw.size);
console.log(hw.call());
静态属性、方法
class Phone {
static name = 'hw';
static call() {
console.log('call me');
}
}
const hw = new Phone();
console.log(hw.name);
console.log(Phone.name);
es5实现继承
function Phone(brand, price) {
this.brand = brand;
this.price = price;
}
Phone.prototype.call = function () {
console.log('call');
};
function SmartPhone(brand, price, size, color) {
Phone.call(this, brand, price);
this.size = size;
this.color = color;
}
SmartPhone.prototype = new Phone();
SmartPhone.prototype.constructor = SmartPhone;
SmartPhone.prototype.photo = function () {
console.log('photo');
};
SmartPhone.prototype.play = function () {
console.log('play');
};
const oppo = new SmartPhone('oppo', 5999, 5.5, 'white');
console.log(oppo);
class Phone {
constructor(brand, price) {
this.brand = brand;
this.price = price;
}
call() {
console.log('call');
}
}
class SmartPhone extends Phone {
constructor(brand, price, size, color) {
super(brand, price);
this.size = size;
this.color = color;
}
photo() {
console.log('photo');
}
play() {
console.log('play');
}
}
const oppo = new SmartPhone('oppo', 9999, 6.5, 'green');
console.log(oppo);
class Phone {
call() {
console.log('call');
}
}
class SmartPhone extends Phone {
call() {
console.log('call super');
}
}
const oppo = new SmartPhone('oppo', 9999, 6.5, 'green');
oppo.call(); // call super
class Phone {
call() {
console.log('call');
}
}
class SmartPhone extends Phone {
call() {
super();
console.log('call super');
}
}
const oppo = new SmartPhone('oppo', 9999, 6.5, 'green');
oppo.call();
get可以应用于获取平均数等需要函数处理的数据
set可以在设置是对数据进行判断等操作
class Phone {
get price() {
console.log('get');
return 9999;
}
set price(val) {
console.log('set');
}
}
const hw = new Phone();
console.log(hw.price);
hw.price = 8888;
Number.EPSILON js最小精度
Number.EPSILON 是js中的最小精度,如果两数相差小于Number.EPSILON,则认为两数相等。
属性值接近于: 2.220446049250313e-16
console.log(Number.EPSILON); // 2.220446049250313e-16
const equal = (a, b) => {
if (Math.abs(a - b) < Number.EPSILON) {
return true;
} else {
return false;
}
};
console.log(0.1 + 0.2 === 0.3); // false
console.log(equal(0.1 + 0.2, 0.3)); // true
let b = 0b1010;
let o = 0o777;
let d = 100;
let x = 0xff;
console.log(b, o, d, x); // 10 511 100 255
console.log(Number.isFinite(100)); // true
console.log(Number.isFinite(100 / 3)); // false
console.log(Number.isFinite(Infinity)); // 无穷 false
es5中isNaN为单独的一个方法
es6中封装到Number中的一个方法
console.log(Number.isNaN(123)); // false
console.log(Number.isNaN('gg')); // false
console.log(Number.isNaN(NaN)); // true
之前 Number.parseInt 、Number.parseFloat也是单独的方法
会自动截断字符串
console.log(Number.parseInt('3141592653gg了7777')); // 3141592653
console.log(Number.parseFloat('3.141592653gg了7777')); // 3.141592653
console.log(Number.isInteger(8)); // true
console.log(Number.isInteger(8.9999)); // false
console.log(Math.trunc(3.141592653)); // 3
返回结果为1则为正数,0为零,-1为负数
console.log(Math.sign(100)); // 1
console.log(Math.sign(0)); // 0
console.log(Math.sign(-100)); // -1
作用类似 === 全等符号,又有些不同
console.log(Object.is(120, 120)); // true
console.log(Object.is(120, 121)); // false
console.log(Object.is(NaN, NaN)); // true
console.log(NaN === NaN); // false
存在相同的属性,后面的覆盖前面的,不存在的不会覆盖,执行合并。适用于配置的合并
const config1 = {
host: '115.29.193.2',
prot: '80',
name: 'root',
test1: 'test1'
};
const config2 = {
prot: '555',
pwd: 'root',
test2: 'test2'
};
console.log(Object.assign(config1, config2));
const Phone = {
name: 'hw'
};
const actions = {
actions: ['call', 'geme', 'photo']
};
Object.setPrototypeOf(Phone, actions);
console.log(Object.getPrototypeOf(Phone));
console.log(Phone);