DAY30-class

class Car {
	// 构造函数 - (工厂中接头人)
	// 实例化 - (造车的过程) => 类创建对象(实例)的过程

	// whell = 4;

	constructor(wheel, color, length, width) {
		this.whell = wheel;
		this.color = color;
		this.length = length;
		this.width = width;

		this.speed = 0;
	}

	// 加速
	speedUp() {
		this.speed += 1;
	}
}

const car1 = new Car(3, '#f00', 20, 40);
const car2 = new Car(33, '#ff0', 88, 99);

console.log(car1, car2);

`class` 关键字定义了一个名为 `Car` 的类，在该类中，定义了一个 `constructor()` 构造函数，这个构造函数在类实例化时会被自动调用。构造函数的参数为 `wheel`（轮子数）、`color`（汽车颜色）、`length`（汽车长度）和 `width`（汽车宽度），这些参数会被存储在该类的实例（即被创建出来的对象）中。

在该类中，还定义了一个 `speedUp()` 方法，该方法用于增加车速。

代码的最后，通过 `new` 运算符将 `Car` 类创建了两个实例，分别为 `car1` 和 `car2`，它们的属性值与在创建类实例时传入的参数相对应。这些对象被打印到了控制台，以便查看它们的属性和值。

const obj = {
 	name: '',

 	get name() {
 		console.log('123');
 		return this.name;
 	},

 	set name(val) {
 		this._name = val;
 	
 }

 obj.name;

这段代码定义了一个对象obj，其中包含一个属性name和两个方法get name 和 set name。

当执行obj.name时，由于name属性的getter方法get name中包含console.log('123')，因此会在控制台输出123。然而，get name方法中又尝试获取name属性的值，这会导致死循环，并在一定次数后抛出"Maximum call stack size exceeded"异常。

get和set在这段代码中的作用？

在这段代码中，get和set是JavaScript中属性访问器(Property Accessors)的方法名，它们分别用于获取和设置对象的属性。

在这段代码中，obj对象中的name属性同时定义了getter方法和setter方法。当你通过obj.name访问该属性时，JavaScript会自动调用该属性对应的getter方法，并返回该方法的执行结果。同样地，当你给该属性赋值时，JavaScript会自动调用该属性对应的setter方法，并把赋值的值作为参数传入setter方法中进行处理。

get和set可以帮助我们在读取和设置对象的属性时，进行更加灵活的数据处理，从而更好地维护对象的内部状态。

const obj = {
 	_name: '',

 	get name() {
 		console.log('123');
 		return this._name;
 	},

 	set name(val) {
 		this._name = val;
 	}
 }

 obj.name = 222;

这段代码定义了一个对象obj，其中包含了一个属性_name和两个方法get name 和 set name。

当执行obj.name = 222;时，会自动调用obj对象中的set name方法，并将参数222作为参数传入该方法中。在set name方法中，会将传入的参数222赋值给对象的属性_name，进而实现对该属性值的更新。

这段代码并未显式地输出任何值，因此不会在控制台上显示任何输出内容。如果我们在get name方法中增加console.log语句，就可以在控制台中看到输出的内容。例如，如果我们将get name方法修改为：

get name() {
console.log('get name:', this._name);
return this._name;
},

那么在执行obj.name = 222;后，控制台将输出：get name: 222。这表明成功将对象的属性_name的值更新为了222，并可以通过get name方法获取到该属性的当前值。
 

class Person {
 	constructor() {
 		this._name = '';
 	}

 	get name() {
 		console.log('正在访问name');

 		return `我的名字是${ this._name }`;
 	}

 	set name(val) {
 		console.log('正在修改name');

 		this._name = val;
 	}
 }

 const person = new Person();

 person.name = '鸽王';

 console.log(person.name);

这段代码定义了一个Person类，该类中包含了一个私有属性_name 和两个方法get name 和 set name。

在类的构造函数中，我们将私有属性_name初始化为空字符串。在get name方法中，会输出'正在访问name'这段日志，并返回格式化后的字符串`我的名字是${ this._name }`。而在set name方法中，会输出'正在修改name'这段日志，并将传入的参数val赋值给属性_name。

接着我们创建了一个person对象，将该对象的name属性赋值为'鸽王'，因此会自动调用set name方法，并将'鸽王'这个字符串作为参数传递进去。在set name方法中，会将_name属性赋值为'鸽王'。

最后，我们输出了person对象的name属性，并在控制台中打印出其返回结果。由于get name方法在访问name属性时输出了日志信息，因此控制台会打印出'正在访问name'这段信息，并输出`我的名字是鸽王`，表明成功获取了该对象的name属性值。

 class AudioPlayer {
 	constructor() {
 		 0 - 暂停 | 1 - 播放 | 2 - 加载中
 		this._status = 0;

 		this.status = 0;

 		this.init();
 	}

 	init() {
 		const audio = new Audio();
 		audio.src = '....';

 		audio.oncanplay = () => {
 			audio.play();
 			this.status = 1;
 		}
 	}

 	get status() {
 		return this._status;
 	}

 	set status(val) {
 		const STATUS_MAP = {
 			0: '暂停',
 			1: '播放',
 			2: '加载中'
 		};

 		document.querySelector('#app .play-btn').innerText = STATUS_MAP[val];
 		this._status = val;
 	}
 }

 const audio = new AudioPlayer();

这段代码定义了一个AudioPlayer类，用于控制web页面上的音频播放器。在类的构造函数中，我们初始化了音频播放器的状态和界面显示，并调用了init方法来初始化音频播放器。 

在init方法中，我们创建了一个new Audio()实例作为音频播放器，并将其src属性指向一个音频资源。当audio.oncanplay（音频数据已经准备好）事件被触发时，我们播放这个音频，并更新播放器的状态（status）为1，即“播放”状态。 

在get status方法中，我们返回状态值_status，该值代表着当前的播放器状态。在set status方法中，我们通过一个常量对象STATUS_MAP将状态值映射为对应的状态文本，并将该文本显示在页面上的play-btn控件上，以便用户了解当前播放器的状态。

最后，在代码的最后，我们创建了一个AudioPlayer类的实例audio来控制我们的音频播放器。

如果没有名字，会取变量的名字 

function Constructor(fn, args) {
	var _this = Object.create(fn.prototype);

	var res = fn.apply(_this, args);

	return res ? res : _this;
}

function Person(name, age) {
	this.name = name;
	this.age = age;
}

Person.prototype.say = function() {
	console.log('我叫' + this.name);
}

var person = Constructor(Person, ['张三', 12]);

console.log(person);

这段代码演示了如何使用 `Constructor` 函数来实例化一个 `Person` 的对象，以及如何访问该对象的属性和方法。

首先定义了一个构造函数 `Person`，接收两个参数 `name` 和 `age`，并将其分别赋值给对象实例的属性 `name` 和 `age` 上。同时，给 `Person.prototype` 添加了一个 `say` 方法，用来输出 `this.name`。

然后调用 `Constructor` 函数，并将 `Person` 函数和 `['张三', 12]` 这两个参数传递给它。`Constructor` 函数会返回一个对象实例 `person`，该实例继承了 `Person.prototype` 上的方法和属性，同时也有自己的 `name` 和 `age` 属性，并且可以使用 `say` 方法。

最后，在控制台输出了这个对象 `person` 的信息，可以看到它的属性和方法都被正确地输出了。