/*
字面量速写:
如果属性名和形参名一致,可以直接写形参名
方法速写:省略冒号和function
sayHello(){} //实际上是 sayHello :function(){}
计算属性名
通过 [] 计算出来
*/
//方法速写
//字面量速写:
// function san(a,b,c,d){
// const sayHello = function(){
// console.log('a',this.a)
// }
// return{
// a, // 实际上是 a : a
// b,
// c,
// d,
// sayHello,
// }
// }
// //console.log(san(1,2,3,4))//{a: 1, b: 2, c: 3, d: 4}
// const u = san(1,2,3,4)
// u.sayHello()
// const user = {
// name: 'a',
// sayHello(){//实际上是 sayHello :function(){}
// console.log(this.name)
// }
// }
// user.sayHello()//a
const prop1 = 'name2'
const prop2 = 'sayHello1'
const user = {
//[prop1] 实际上就是name2 ; name2 : 'a'
[prop1] : 'a',
[prop2](){
console.log(this[prop1])
}
}
console.log(user)//{name2: 'a', sayHello1: ƒ}
user[prop2]()//a
/* Object新增api
Object.is(第一个值,第二值) 判断数字是否相等
特殊情况 +0 / -0 = true NaN /NaN =false
Object.getOwnPropertyNames方法,规定数组排序方式如下:先排数字,在拍其他
Object.setPrototypeOf
*/
//Object.is
// const a = 11;
// const b = 11;
// console.log(Object.is(a,b))
const obj1 = {
a:1
}
const obj2 = {
b:2
}
Object.setPrototypeOf(obj1,obj2)
console.log(obj1)
面向过程:一步接着一步的去写,适合比为简单一点的项目,比如大象装冰箱(第一步:拿取大象;第二部:打开冰箱;第三步:扔进冰箱;第四部:关闭冰箱)
面向对象:找到关键词,比如大象装冰箱(找到关键词,大象和冰箱;写完后,在给大象/冰箱原型或者什么地方写入属性名属性值去用)
/* 类构造函数
传统构造函数问题:(参考类和构造函数语法题文件)
1。属性和原型方法定义分离,降低可读性
2.原型成员可以被枚举
3.默认情况下,构造函数仍然可以被当做普通函数使用
类的特点:
1.类声明不会提升,和let,const一样,存在暂时行死期(提前被调用)
2.类中所有代码在严格模式下进行
3.类所有方法不可枚举(如在原型上写的属性)
4.类所有方法内部无法被当做构造函数使用
5.类构造器必须使用new来调用
*/
//class 类型 Animal名
class Animal {
//构造器
constructor(type,name,age,sex){
this.type = type,
this.name = name,
this.age = age,
this.sex = sex
}
//写的方法
print(){
console.log(`[种类] , ${this.type}`);
console.log(`[名字] , ${this.name}`)
console.log(`[年龄] , ${this.age}`)
console.log(`[性别] , ${this.sex}`)
}
}
const a = new Animal('狗','旺财','1','男');
console.log(a)
a.print();
//因为在类里面写,所以只是打印Animal中的属性,不会打印原型的,也就不可枚举
for(var i in a){
console.log(i)
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<script>
/* 类书写
1.计算成员名称 : const prop = 'name'; [prop] : '测试'
2.getter和setter:对于某个属性的值进行读取和设置,getter和setter控制的属性,不在原型上
3.静态成员:构造函数本身的成员;应用场景:比如棋子,他的宽高,那么每个棋子都需要用到宽高;可以直接设置到静态成员上;使用static 关键字定义成员静态成员
5.类表达式 :const aaa = class An{}
6.装饰器 :@Obsolete ;当语法过期后,可以使用该语法给他注释掉
给age加下划线/其他特殊符号的目的是:告诉他人这个age不希望直接去使用
*/
//class 类型 Animal名
// class Animal {
// //构造器
// constructor(type, name, age, sex) {
// this.type = type;
// this.name = name;
// this.age = age
// this.sex = sex;
// }
// //创建一个age属性,并给他加上getter,堵盖该属性,会运行该函数
// get age() {
// return this._age + "岁";
// }
// //创建一个age属性,给他加上setter,给该属性赋值,会运行给函数
// set age(age) {
// if (typeof age !== "number") {
// throw new TypeError("错了");
// }
// if (age < 0) {
// age = 0;
// } else if (age > 100) {
// age = 100;
// }
// this._age = age;
// }
// //写的方法
// print() {
// console.log(`[种类] , ${this.type}`);
// console.log(`[名字] , ${this.name}`);
// console.log(`[年龄] , ${this.age}`);
// console.log(`[性别] , ${this.sex}`);
// }
// }
// var a = new Animal("狗", "旺财", 1, "男");
// console.log(a);
// // a.print();
//静态成员
class abc{
constructor(name){
this.name = name
}
static width = 50;
static height = 50;
}
var a = new abc()
console.log(abc.width)//只有构造函数本身有
console.log(a.width)//新创建对象式没有这个的
</script>
</body>
</html>
/*
继承
ES6要求,如果定义了constructor,并且该类是子类,则必须在constructor的第一行手动调用父类的构造函数
如果子类不写constructor,则会有默认的构造器,该构造器需要的参数和父类一致,并且自动调用父类构造器
用户JS制作抽象类:抽象类:一般是父类,不能通过该类创建对象(也就是不能使用父类,父类一般都是公共的)
this执行具体的类的对象
*/
class Animal{
constructor(type,name,age,sex){
throw TypeError('不能给animal创建对象,他是公共的')
this.type = type,
this.name = name,
this.age = age,
this.sex = sex
}
print(){
console.log(`[种类] , ${this.type}`);
console.log(`[名字] , ${this.name}`)
console.log(`[年龄] , ${this.age}`)
console.log(`[性别] , ${this.sex}`)
}
}
class Dog extends Animal{
constructor(name,age,sex){
super('猫类',name,age,sex);
this.hobby = '吃鱼'
}
print(){
super.print();//去继承animal的print方法
console.log(`[爱好] , ${this.hobby}`)//在animal的父类上在添加一个爱好给dog
}
}
const a = new Animal('犬類','旺财',1,'公')
a.print()
console.log(a)//Animal {type: '犬類', name: '旺财', age: 1, sex: '公'}
//dog继承animal
const b = new Dog('二米',0.5,'母')
b.print();
console.log(b)//Dog {type: '猫类', name: '二米', age: 0.5, sex: '母'}