面向对象,私有属性和公有属性的检测以及一些拓展

/*
 * 1.什么是面向对象? 
 *   面向对象是一个非常伟大的“编程思想/方式”，依据 “对象、类、实例” 来构建一门语言，这样我们后期不论是学习还是开发，都应该按照 类和实例 来进行操作，这样做的好处：实例既可以具备自己独有的一些私有属性方法，也可以具备类赋予他们的公共属性和方法，私有和公有的属性方法可以进行有效的管理！！例如：一个功能，在项目中需要使用多次，此时我们需要保证，每一次使用所用到的一些信息是独立的，但是具体如何去做的一些方法，每一次都应该是公共的...  此时我们就可以创造一个类，每一次使用都是创造其一个单独的实例...「插件、UI组件、类库、框架...」
 *   
 * 面向对象 OOP ：javascript、java、php、python、C#(ASP.NET)、Go、Ruby...
 * 面向过程 POP ：C
 * 
 * 对象：万物皆对象，它是一个泛指
 * 类：对象的一个具体细分（大类/小类、内置类/自定义类...）  类的别称“构造函数/构造器”
 * 实例：类中的一个具体事物
 * 
 * 2. JS中常见的内置类
 *   数据类型相关的：一般每一种数据类型都有一个自己所属的类
 *      Number:每一个数字类型的值都是他的一个实例
 *      String、Boolean、Symbol、BigInt、Array、RegExp、Date、Error、Function、Object...
 * 
 *   元素对象相关的：每一个HTML标签都有自己所属的类
 *      HTMLDivElement
 *      HTMLParagraphElement  -> HTMLElement
 *      ...                      XMLElement  -> Element ->  Node -> EventTarget -> Object
 *                               ...            Text(CharacterData)
 *                               HTMLDocument -> Document
 *                                              ...
 *   
 *   元素集合/节点集合
 *      HTMLCollection 
 *      NodeList   -> Object
 *      ...
 *      
 *   每个实例之间都是独立的，具备一些自己的私有属性方法（所以很多人把基于面向对象方式构建的实例称之为“单例设计模式”，但是从JS本身专业角度来讲，这种方式叫做“构造函数设计模式”）；每个实例还同时具备类，其父类赋予他们的公共属性方法；
 * 
 * 思考题：
 *    document.getElementById(“元素ID”)
 *      document被称之为获取的上下文[context]
 *      特点：getElementById方法的上下文只能是document   思考为啥？
 *    
 *   [context].querySelector(“#元素ID”)
 *      querySelector的上下文可以是任何一个DOM元素对象   思考为啥？
 */


/* function Fn(x, y) {
    let sum = 10;
    this.total = x + y;
    this.say = function () {
        console.log(`我计算的和是:${this.total}`);
    };
}
// let res = Fn(10, 20); //普通函数执行
let f1 = new Fn(10, 20); //构造函数执行
let f2 = new Fn;
console.log(f1.sum);
console.log(f1.total);
console.log(f1.say === f2.say); */


/* function Fn(x, y) {
    let sum = 10;
    this.total = x + y;
    this.say = function () {
        console.log(`我计算的和是:${this.total}`);
    };
    // return {
    //     name: 'xxx'
    // };
    return 10;
}
let f1 = new Fn;
console.log(f1); */


function Fn(x, y) {
    let sum = 10;
    this.total = x + y;
    this.say = function () {
        console.log(`我计算的和是:${this.total}`);
    };
}
let f1 = new Fn(10, 20);
// console.log(f1);

// 知识点1：检测某个属性是否为对象的“私有属性”
//   + f1是Fn类的实例，也是Object这个类的实例
//   + Object.prototype.hasOwnProperty  这个方法就是用来检测私有属性的
// console.log(f1.hasOwnProperty('say')); //=>true 特点：必须是它的一个私有属性才可以「有这个属性，但是不是私有的不行 & 没有这个属性更不行」
// console.log(f1.hasOwnProperty('hasOwnProperty')); //=>false

// 扩充：只想检测是不是他的一个属性「不论是私有还是公有」
// console.log('say' in f1); //=>true
// console.log('hasOwnProperty' in f1); //=>true
// console.log('sum' in f1); //=>false

/* // 需求：检测这个属性是否为他的公有属性？
// 方案->是它的属性，但是还不能是私有的
function hasPubProperty(obj, attr) {
    return (attr in obj) && !obj.hasOwnProperty(attr);
}
console.log(hasPubProperty(f1, 'say')); //=>false
console.log(hasPubProperty(f1, 'hasOwnProperty')); //=>true
console.log(hasPubProperty(f1, 'sum')); //=>false

// toString既是私有的，也是公有的
f1.toString = function () {};
console.log(hasPubProperty(f1, 'toString')); //=>false  ? */

// 重新hasPubProperty方法
// Object.prototype.hasPubProperty = function(attr){
//     // this -> obj要处理的对象
//     // 找到当前对象的原型,而且一直向上找,直到找到Object.prototype为止,在查找的过程中,只要某个原型对象中有
//     // ATTR这个属性 这个属性就是对象的公有属性....
//     // 不能使用this.__proto__ 因为IE浏览器不支持这种写法 所以要找到原型对象要使用Object.getPrototypeOf(this)
//     let proto = Object.getPrototypeOf(this)
//     while(proto){
//         if (proto.hasOwnProperty(attr)) return true 
//         proto = Object.getPrototypeOf(proto)
//     }
//     return false
// }

/* // instanceof：检测当前实例是否为某个类的实例
console.log(f1 instanceof Fn); //=>true
console.log(f1 instanceof Object); //=>true
console.log(f1 instanceof Array); //=>false */