51工具盒子⭐️ 有关JavaScript的学习总结
面向对象 {#%E9%9D%A2%E5%90%91%E5%AF%B9%E8%B1%A1}
>面向对象编程(OOP) {#%3E%E9%9D%A2%E5%90%91%E5%AF%B9%E8%B1%A1%E7%BC%96%E7%A8%8B(oop)}
1. 程序是干嘛的？ - 程序就是对现实世界的抽象（照片就是对人的抽象）
- 对象是干嘛的？
一个事物抽象到程序中后就变成了对象
在程序的世界中，一切皆对象
例如：（ ） 心仪的女人：王老五
一个事物通常由两部分组成：数据和功能
一个对象由两部分组成：属性和方法
事物的数据到了对象中，体现为属性
事物的功能到了对象中，体现为方法
数据： 姓名 年龄 身高 体重
功能： 睡 吃
const five = { //添加属性 name:"王老五", age:48, height:180, weight:100,
//添加方法 eat(){ console.log(this.name + "吃饭了") }, sleep(){ console.log(this.name + "睡觉了") }}
- 面向对象的编程
面向对象的编程指，程序中的所有操作都是通过对象来完成
做任何事情之前都需要先找到它的对象，然后通过对象来完成各种操作>类 {#%3E%E7%B1%BB}
使用object创建的问题
无法区分不同类型的对象
不方便批量创建对象
- 在JS中可以通过类(class)来解决这个问题1. 类是对象模板，可以将对象中的属性和方法直接定义在类中， 定义后，就可以直接通过类来创建对象 2. 通过同一个类创建的对象，我们称为同类对象 可以使用instanceof来检查一个对象是否是由某个类创建 如果某个对象是由某个类所创建，则我们称该对象是这个类的实例 语法： class 类名 {} // 类名要使用大驼峰命名 const 类名 = class {} 通过类创建对象 new 类() // const Person = class {} // Person类专门用来创建人的对象 class Person{ } // Dog类式专门用来创建狗的对象 class Dog{ } const p1 = new Person() // 调用构造函数创建对象 const p2 = new Person() const d1 = new Dog() const d2 = new Dog() console.log(p1 instanceof Person) // true console.log(d1 instanceof Person) // false const five = { // 添加属性 name: "王老五", age: 48, height: 180, weight: 100, // 添加方法 sleep() { console.log(this.name + "睡觉了~") }, eat() { console.log(this.name + "吃饭了~") }, } const yellow = { name: "大黄", age: 3, sleep() { console.log(this.name + "睡觉了~") }, eat() { console.log(this.name + "吃饭了~") }, }</code></pre>>属性 {#%3E%E5%B1%9E%E6%80%A7}
类是创建对象的模板，要创建第一件事就是定义类
class Person{ /* 类的代码块，默认就是严格模式， 类的代码块是用来设置对象的属性的，不是什么代码都能写 */ name = "孙悟空" // Person的实例属性name p1.name age = 18 // 实例属性只能通过实例访问 p1.age static test = "test静态属性" // 使用static声明的属性，是静态属性（类属性） Person.test static hh = "静态属性" // 静态属性只能通过类去访问 Person.hh } const p1 = new Person() const p2 = new Person() `console.log(p1) console.log(p2)`<br />
>方法 {#%3E%E6%96%B9%E6%B3%95}
class person { name = "孙悟空" sayHello == function(){ } 添加方法的一种方式 sayHello(){ console.log('大家好，我是' + this.name) } // 添加方法(实例方法)，实例方法中的this就是当前实例！ 谁调用了就是谁的this，例如P1调用，则this指向P1 static test(){ console.log('我是静态方法'，this) } // 静态方法（类方法）通过类来调用，静态方法中this 指向的是当前类，例如Person.test调用，则指向Person } const p1 = new Person() //console.log(P1) `Person.test() //静态方法的调用方式`<br />
>构造函数 {#%3E%E6%9E%84%E9%80%A0%E5%87%BD%E6%95%B0}
// class Person{ // name="孙悟空" // 当我们在类中直接指定实例属性的值时， // // 意味着我们创建的所有对象的属性都是这个值 // age=18 // gender="男" // sayHello(){ // console.log(this.name) // } // } // 创建一个Person的实例 // const p1 = new Person("孙悟空", 18, "男") // const p2 = new Person("猪八戒", 28, "男") // const p3 = new Person("沙和尚", 38, "男") // console.log(p1) // console.log(p2) // console.log(p3) class Person{ // 在类中可以添加一个特殊的方法constructor // 该方法我们称为构造函数（构造方法） // 构造函数会在我们调用类创建对象时执行 constructor(name, age, gender){ // console.log("构造函数执行了~", name, age, gender) // 可以在构造函数中，为实例属性进行赋值 // 在构造函数中，this表示当前所创建的对象 this.name = name this.age = age this.gender = gender } } const p1 = new Person("孙悟空", 18, "男") const p2 = new Person("猪八戒", 28, "男") const p3 = new Person("沙和尚", 38, "男") `console.log(p1) console.log(p2) console.log(p3)`<br />
>封装 {#%3E%E5%B0%81%E8%A3%85}
面向对象的特点：封装、继承、多态。
/* 1、封装 * 对象就是一个用来存储不同属性的容器 * 对象不仅负责存储属性，还要负责数据的安全 例如 P1.name = -11 / haha 数据被修改，不安全 * 直接添加到对象中的属性并不安全，因为它们可以被任意的修改 * 如何确保数据的安全？ ① 私有化数据 : 将需要保护的数据设置为私有，只能在类内部使用 ② 提供 setter 和 getter 方法来开放对数据的操作 * 属性设置私有，通过 getter 和 setter 方法操作属性带来的好处？ ？可以控制属性的读写权限 ？可以在方法中对我们的属性值进行验证 封装为了保护数据的安全，实现封装的方式：！私有化，！getter 及 setter 方法！ get 属性名(){ return this.#属性 } set 属性名(参数){ 可以添加验证逻辑... this.#属性 = 参数 } \*/ class Person{ // #address = "花果山" //实例使用#开头就变成了私有属性，私有属性只能在类内部访问 #name #age #gender //私有化属性必须要先声明 constructor(name,age,gender){ this.name = name this.age = age this.gender = gender } sayHello(){ console.log(this.#name) } /\* //getter方法用来读取属性 getName(){ return this.#name } //setter方法用来设置属性 setName(name){ this.#name = name } getAge { return this.#age } setAge(age){ this.#age = age } //对属性进行验证 setAge(age){ if(age \>= 0){ this.#age = age } } \*/ // js中的标准写法，使用属性来调用 get gender(){ console.log('getter执行了') return this.#gender } set gender(gender){ this.#gender = gender } // 此处调用则需要p1.gender = "女" } const p1 = new Person("孙悟空"，18，"男") // p1.name = "hello" // p1.getName() p1.setAge(-11) // p1.age = 11 // p1.age p1.setName('猪八戒') `console.log(p1.gender)`<br />
