面向对象 与 面向过程
面向对象 => 将大象放进冰箱
1.打开冰箱
2.把大象放入冰箱
3.关上冰箱
按照分析好的步骤一步步执行,解决问题
面向对象 => 将大象放进冰箱
面向对象将事物分成一个一个的对象,然后分工合作
1. 大象对象
设置一个将大象放入冰箱的功能(我的理解是封装一个函数)
2.冰箱对象
设置打开冰箱功能
设置关闭冰箱功能
面向对象是以对象功能来划分;不是按步骤来划分(字面意思,结合例子)
面对对象程序开发思想;每一个对象都有自己的明确的功能;
编码灵活,代码可复用,容易维护,继承性,适合大型项目(这里是和我们的框架打包好,封装好的组件的原理)
把数据以及对数据的操作放在一起(有点像vue里的一些同步组件);作为一个相互依赖的整体---对象;
对象同类对象抽离进行复用;形成类
<script>
//工厂模式
// let obj ={
// name:"夏栀",
// food:"奶茶",
// add(value){
// this.age=10
// console.log(this.name+value+this.food);
// }
// }
// obj.add("站着")
// obj.add("坐着")
//说实话人家自己造的,一开始都不值得去理解,不好理解
function add(val){
let aa =100;
console.log("打开冰箱");
add1(val,aa)
}
add("大象")
function add1(val,aa){
let s=10;
console.log("把"+val+"放入冰箱");
add2(s,aa)
}
function add2(s){
console.log(s);
console.log("关上冰箱");
}
add("大象")
</script>
2,.ES6 面向对象class
面向对象由
属性和方法组成
属性
描述信息,
方法
行为,操作
把数据及对数据的操作放在一起;作为一个相互依赖的整体 ---- 对象;
对象同类对象抽离进行复用;形成类
es6 class 类面向对象写法;
1. class 声明类{ }, 没有声明提升
2. 使用class 必须通过new 构造
3. 返回一个类实例对象
4. class命名与 变量起名规范一致
5. class命名首字母大写
6. constructor类的默认方法,类默认会调用constructor函数; 在这里写对应的属性
7. 通过this设置的属性,在对应的this类里面任何位置都可以访问到
8. class类里面基本上然后函数里面的this代表自身class类
9. constructor默认return this;自己修改时return 设置返回引用类型将会修改返回的数据
<script>
// class类
class Person {
constructor() {
// 通用属性 this 是Person类对象{}
this.name = "夏栀";
this.food = "奶茶";
// 默认返回this对象 自己修改时return 返回了引用类型将会修改返回的数据
// return {}
}
// 不要写,
add() {
// console.log(this);
}
}
// result 实例
let result = new Person()
console.log(result,"实例");
</script>
3.原型链
首先说明这块我并不是很懂,翻了下“红宝书”,发现原型链·只是其中--面向对象程序设计--的继承中的--一小个章节,属于中高级js
原型链
原型放置对应方法
1.new class类执行,返回实例化类对象(this),实例会继承原型的内容
2.class 上面的方法,全部会放在到原型上
3.实例连接到原型上去 实例._prptp_ 到达原型上
4.类怎么到原型上去 class类.prototype 到达原型上
5.原型上有个constructor属性指向class类
原型最终位置是object
毕竟是骨子里的东西,没点对强制类型语言的理解,并不好理解
<script>
// class Person{
// constructor(name,food){
// this.name=name;
// this.food=food;
// return this //类对象
// }
// // 原型
// add(val){
// console.log(this.name+val+this.food);
// }
// }
// // result 实例
// let result =new Person("夏栀","奶茶");
// console.log(result);
//es5原型
function Person1(name,food){
this.name=name;
this.food=food;
}
Person1.prototype.add=function(){
console.log("原型");
}
let resutl1 =new Person1("夏栀","奶茶")
console.log("resutl1");
Array.prototype.add=function(){
let len =this.length;
let result=0;
for(let index =0;index<len;index++){
result +=this[index]
}
return result
}
let arr=[11,12,33]
let arr1=[1,2,3]
</script>