JavaScript高阶：初学面向对象

理解对象

面向对象有两个基础概述：

类（class）：将所有一类对象共有的特征抽象化，形成这一个类的特征（人类、狗类…）
对象（object）：一类事物中的一个具体个例，就是一个对象（张三）

class Person(){
//属性
//方法
}

JS的内置类

JS提供了非常多内置的类：Number(数字类）、String（字符串类）、Date（日期类）、Math（数字类）、Array（数组类）、Function（函数类）、Object（对象类）

//可以使用new来实例化一个函数对象:new Function(‘参数‘，’函数体’)
//系统内置类
var show = new Function(“a”,“console.log(a)”);//实例化一个show函数，输入一个参数a，执行函数体
show(10);//结果输出10

自定义类

1、字面量对象

var obj={}；
obj.name="mike";
obj.age=19;
//var obj2={name:'mike',age:999};
console.log(obj);
//console.log(obj instanceof Person);

2、工厂模式：就是设计中的工厂，给定一些值，计算出结果

function Person(name,age){
var 0 =new Object();
o.name=name;
o.age=age;
o.showName = function(){
alert(this.name);}
}
var person = Person('老王',67);
console.log(person);

3、构造函数（常用）
// ES5

function Person(name,age){
//定义类的特征——成员属性
this.name=name;
this.age=age;
//定义类的行为——方法
this.showName = function()
{
alert(this.name);
}
}
var person =new Person('老王',17);

构造函数说明

类/构造函数的特征：

1、构造函数的函数名（类名）大写
2、没有 new Object显式创建对象
3、属性和方法都挂载在this上面
4、没有return语句

new关键字的实现机制：
1、创建一个新对象
2、将构造函数中的this指向新对象
3、执行构造函数中的语句，将所有属性都挂到新对象（this只想新对象）
4、把新对象的内存地址赋给变量

方法过载

//方法过载的问题：为每一个对象都创建了一个单独的方法，占据了大量的内存空间
//如何解决？——原型！！！！

function Person(name,age){
this.name=name;
this.age=age;
this.run = function(){
函数体
}
}
var person1 =new Person("刘备",89);//每次都创建一个新的实例，赋予一个新的内存地址会导致内存过大，不好
var person2 =new Person("关羽",78);
person.run();
console.log(person1.run === person2.run);//fasle

原型（非常重要）

1、什么是原型？
原型就是prototype属性，所有function定义的函数都拥有这个属性
prototype属性是一个对象，可以添加属性和方法
2、原型有什么用
1）解决方法过载的问题
2)扩展类的功能（重点）——直接添加方法，可直接用（个人觉得没有什么特别的）
3、原型的写法
//定义原型方法
类名.prototype.属性名或方法名=值；
//使用原型方法

//将所有方法都放在原型上

//定义一个构造函数、类
function Person(name,age){
this.name=name;
this.age=age;
}
//定义一个原型方法
Person.prototype.run = function(){
函数体
};
//实例化一个对象
var person1 =new Person("刘备",89);
var person2 =new Person("关羽",78);
console.log(person1.run === person2.run );//true

//需求：扩展String类，填写方法实现获取字符串的第一个字
var str ="今天是星期五 ";

//对字符串类进行扩展（编写插件）
String.prototype.findFirst=function(){
return this.substr(0,1);//返回所要获取的字符位置-“今”
}
console.log(str.findFirst());
console.dir(String);//查找对象的结构

属性访问的优先级

对象>构造函数>属性 >原型>原型链（父类）

function User(username,password) {
this.username=username;
this.password=password;
}
//定义一个原型方法
User.prototype.login=function(){
console.log(this.username="登录了系统");
}
//定义一个原型属性
User.prototype.username="张飞";
//实例化一个对象
var u1=new User('关羽','123456');
u1.username="刘备";//给对象添加属性username

console.log(u1.username);//结果：刘备
console.log( u1 instanceof User);//判断u1是否属于User类，结果为true。以下类似
console.log( u1 instanceof Object);
console.log( User instanceof Object);
console.log( User instanceof Function);

神秘的_proto_（没听懂）

_proto_实际上是对类的prototype属性进行引用！！！
_proto_出现在对象上
prototype出项在（类/构造函数）上，对象上的_proto_实际上是对类的prototype进行引用（内存地址都一样）

常见的属性：
constructor 在原型上声明构造函数

function User(username,password) {
this.username=username;
this.password=password;
}
//定义一个原型方法
User.prototype.login=function(){
console.log(this.username="登录了系统");
var u1 = new User("曹操","123");
console.log(u1._proto_ ====User.prototype);
}