Set对象
是一个对象
存放的数据不会重复
可以理解为不重复的数组
Set 对象 需要被 new 出来使用
数组转Set对象
const set = new Set([1,2,3])
Set对象转数组
const arr = [...Set]
Set对象add方法
set.add(123)
// Set 对象 需要被 new 出来使用
const set = new Set()
// 存放数据 用add方法
set.add(1)
set.add(2)
set.add(3)
set.add(3)
set.add(2)
set.add(2)
console.log(set) // {1,2,3}
// 把 set对象 转成数组
const arr = [...set]
// 数组转 Set对象
const set2 = new Set(arr)
console.log(arr) //[1,2,3]
console.log(set2) //{1,2,3}
面向对象
项目级别代码的思维
特征: 封装 继承
创建对象的方式
字面量
- 不适合创建多个同样类型的对象的场景
- 不方便维护 修改
const obj ={ name:"悟空",height:100,age:5000};
工厂函数
失去
血缘关系,无法简单分辨对象的特征封装
-
无法继承
function p(name,a,b,c,d,e) { return { nickname:name, a,b,c,d,e } } function person(name, height,a,b,c,d,e) { return { nickname: name, height, a,b,c,d,e }; }
构造函数
可以方便的创建对象
方便后期维护修改
函数提取到外部,多个实例共享一个函数(优化内存空间)
-
弊端: 污染全局变量
function createStudent(name, age) { this.name = name; this.age = age; this.say = function () { console.log(this.name); } } const obj = new createStudent("悟能", 83); const obj1 = new createStudent("悟能1", 84); console.log(obj.say === obj1.say); // false 不是同一say方法 浪费了内存[图片上传失败...(image-6d5605-1652531679819)]
构造函数 + 原型
- 最为主流的解决方案
构造函数
本质是一个函数
名称规范 首字母大写
作用: 用来创建对象
-
创建出来的对象叫 实例
function Preson() { } const pre = new Preson() //Preson()就是构造函数 pre 就是实例 内部会默认返回this
this等于一些被new的实例
this
构造函数中 都存在一个 this
构造函数 默认情况下 返回的是this
this 等于 new出来的实例
只要给构造函数中的this 添加 属性或方法 实例就拥有对应的属性和方法
function Preson() {
this.username = '八戒'
this.add = () => {}
}
const per = new Preson()
per.height = 100
const per2 = new Preson()
console.log(per)
console.log(per2)
给实例添加属性的方法
- 非函数类型的属性 添加在构造函数内部
- 函数类型的属性 添加在原型上 在原型上的属性通过this来访问到 在构造函数中定义的属性
原型
- 原型本质是个对象 在创建构造函数的时候就有
- 在原型上添加一些方法 可以直接 被实例 使用 和共享
[图片上传失败...(image-58cd9d-1652531679819)]
小案例
function Person() {
this.hair = 100
// this.decrease = decrease
}
// 在原型上添加方法
Person.prototype.decrease = function decrease() {
this.hair--
}
const p1 = new Person()
const btn = document.querySelector('button')
btn.addEventListener('click',function () {
p1.decrease()
console.log(p1.hair)
})
