面向对象编程（深入）

/* 
面向对象的三个概念
1、类：是一个抽象概念，是产生对象的一个容器
2、对象（实例）：是一个实体，由类产生出来的一个带有类属性和方法的实体。
3、实例化：产生对象的过程
*/


//一、 构造函数：是一个特殊的函数，用来模拟类，是产生对象的模板
// 1、构造函数内部使用了this关键词，this表示要产生对象的实体
// 2、必须要用new关键字实例化
function ClassPeople (name,age) {
    this.name = name;
    this.age = age;
    console.log(this);//person  person2
}
var person = new ClassPeople('ls', 18)//这里this就指向这个对象
console.log(person);//ClassPeople {name: "ls", age: 18}
var person2 = new ClassPeople('zs', 19)//这里this就指向这个对象
console.log(person2);//ClassPeople {name: "zs", age: 19}

//非严格模式下，函数的this指的是window全局对象，有了new命令后，指向的是对象

//3、new.target  如果当前函数是new命令调用，new.target指向的是当前函数，否则是undefined
function ClassAnimal(name, age) {
    this.name = name
    this.age=age
    console.log(this);//ClassAnimal {name: "ls", age: 18}
    console.log(new.target);//此函数
}
var animal = new ClassAnimal('ls', 18)//new命令调用






//二、object.create(proto,[propertiesObject]),可以把对象作为一个模板，生成新的实例对象
var cat = {
    name: 'cat',
    age:10
}
var cat1 = Object.create(cat, { go: { value: 'go' } })
console.log(cat1);//{go: "go"}






// 三、this除了用在构造函数里面，还可以用在其他场合。
// 1. this返回的总是一个对象。
// 2. this代表就近调用该属性或者方法的对象

var persona = {
    name: 'zs',
    move: function () {
        console.log(this);
        return this.name;
    }
}
var personb = {
    name:'ls'
}
personb.move = persona.move;
var res = personb.move();//personb对象
console.log(res);//ls




 

//四、绑定this,this默认是动态切换的，有时候需要把this固定下来
//1.call(object,arguments),可以改变函数内部的this指向object，arguments为函数的其他参数
var obj = { name: 'test' }
function f1(a,b) {
    console.log(this, a, b);
}

f1.call(obj, 123, '12')//f1函数内部的this指向obj对象，如果obj是null或者undefined,则不能改变this的指向。{name: "test"} 123 "12"
f1()
//2.apply(object,[argument]),和call一样，只是传递的参数需要放到数组里面传递
f1.apply({ name: 'dl', age: 18 }, [123, '12'])//{name: "dl", age: 18} 123 "12"
//3.bind()将函数体内的this绑定到某个对象，返回一个新的函数
var counter = {
    count: 0,
     inc: function(){
        console.log(this);
        this.count++;
  }
}
var counter2 = {
    count: 2,
}
var func = counter.inc.bind(counter2)//j将this指向counter2
func()//{count: 2}
console.log(counter2.count);//3






// 五、对象的继承
// 面向对象编程很重要的一个特征就是有继承概念。A对象继承B对象，A对象就有了B对象的所有属性和方法。
// 大部分面向对象编程语言都是通过类实现继承，js没有类的体现，只能通过改变this指向的方式实现继承。
function Animals(name,age){
    this.name = name,
        this.age = age,
        this.mouse = function () {
        console.log('mouse');
        }
}
function Cat() {
    Animals.call(this,'lyb','18')
    this.color = 'red',
        this.move = function () {
        console.log('move');
    }
}
var cat = new Cat()
console.log(cat);//Cat {name: "lyb", age: "18", mouse: ƒ, color: "red", move: ƒ}





// 六、原型对象
// 1. 原型就是一个共享对象。每个函数都有一个prototype属性，指向一个对象(就是一个原型对象),把属性和方法都定义到原型上，就可以实现多个对象的属性和方法的共享，节省了内存。
function People(name){
    this.name = name;
    // this.say = function () {
    //     console.log('i   say');
    // }
}
People.prototype.say = function () {// 把公有的say方法放在People方法的原型对象上面，构造函数产生的对象会自动有该原型。
    console.log('i   say');
}
console.log(People.prototype);//{say: ƒ, constructor: ƒ}
var pe1 = new People('zs')
var pe2 = new People('ls')
console.log(pe1, pe2);////People {name: "zs"} People {name: "ls"}
pe1.say();//i   say
// 2. 原型链: 所有的对象都有一个原型对象，可能原型对象还有自己的原型对象，这样一直可以找下去，null没有任何属性和方法，原型链的尽头就是null。
console.log({ name: "1111" });






//七、原型对象的继承
function Father() {
    this.name='p1'
}
Father.prototype.move = function () {//父类原型对象中添加move方法
    console.log('move');
}

function Son() {// Son类对象（son1）的原型对象（__proto__:）中默认有一个constructor属性，该属性就是该构造函数
  // 本体属性: 构造函数this上的属性。
  // 如果在原型中（__proto__:），则是原型对象属性。
  // 获取对象的属性是先找本体属性，没有找到再去原型对象中找，直到所有原型对象都没有找到，就返回undefined。
    //Father.call(this) 不能继承父类的原型对象属性，只能继承父类中的本体属性（this）
     //如果要实现原型对象继承，需要采用赋值的方法Son.prototype.move = Father.prototype.move;
    //构造函数中的原型对象会继承到创建的对象中（son1会自动拥有Son的原型对象prototype属性）
    Father.call(this)//
    this.age=18
}
//继承原型对象属性
Son.prototype.move = Father.prototype.move;
var son1 = new Son()
console.log(son1);//如下
/* 
Son {name: "p1", age: 18}
age: 18
name: "p1"
        __proto__://原型对象
        move: ƒ ()//move方法  实现了继承
        constructor: ƒ Son()//创建此函数的构造函数
        __proto__: Object 
        */






//八、instanceof运算符  返回一个bool值，表示对象是否为某个构造函数的实例
var arr = [1, 2, 3];
console.log(arr instanceof Array);//true
console.log(son1 instanceof Father);//false
console.log(son1 instanceof Son);//true




// 九、 Object.getPrototypeOf(obj)返回参数对象的原型对象，是获取原型对象的标准方法
console.log(Object.getPrototypeOf(son1));
/*  
{move: ƒ, constructor: ƒ}
move: ƒ ()
constructor: ƒ Son()
__proto__: Object
*/


//十.Object.setPrototypeOf(obj_a  obj_b)设置参数对象的原型对象  把a对象的原型对象设置为b
var a = {name: "a"};
var b = { age: 123 };
Object.setPrototypeOf(a, b)
console.log(a);
/* 
{name: "a"}
name: "a"
__proto__:
age: 123
__proto__: Object
*/









// 十一、isPrototypeOf(obj) ,用于判断一个对象是否为参数对象的原型.
var a = {name: "a"};
var c = Object.create(a);
console.log(a.isPrototypeOf(c)); // 判断a对象是否为c对象的原型//true





// 十二、 Object.create(a,b); // 返回一个以a为原型对象的新对象，{}创建本体属性。
var c = Object.create(a,{test:{value:"cccc"}}); 
console.log(c);






// 十三、 __proto__，返回对象的原型
console.log(c.__proto__);
/* 
{name: "a"}
name: "a"
__proto__: Object
*/




// 十四、 hasOwnProperty() 用于判断属性是在对象自身(true)还是原型中
console.log(a.hasOwnProperty("name"));//true








// 十五、js的严格模式
// 一般js编程是用的正常模式，除了正常模式还有一种严格模式，严格模式就是才用更严格的js语法。严格模式是从ES5引入的标准，让js更严谨，为js以后的升级做过渡。
// 1. 在js脚本开头添加"use strict",表示整个js脚本都开启严格模式。
// 2. 严格模式下，变量必须显示声明。
// 3. 不能删除一个变量或函数
// 4. 严格模式下函数内部没有this,this是undefined,正常模式下this指向的是window
function test() {
  "use strict"; // 要么放在文件开头，也可以放在函数里面，表示函数内部开启严格模式
  var sex = "a1";
  var person1 = {};
  // delete person1;
  // function f1(a,a,){
  //   console.log(a)
  // }
  function p1(){
    console.log(this);
  }
  p1();
}


test();