javascript中如何判断一个属性是实例对象属性，还是原型对象属性

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/ForMyQianDuan/article/details/80008763

在写vue插件的时候，遇到一个问题：

一、 在main.js中定义
let obj = {
  install: function (Vue, options) {
  // 把方法定义在Vue原型对象上。
    Vue.prototype.$myPlugin = {
        save(){};
        get(){};
    // console.log(Vue);
    // console.log(options);
  }
}
// 使用插件
Vue.use(obj, {a: 1});

二、在组件中.vue使用插件
getUserData(){
    //说明 this 指vue实例
    let data =  this.$myPlugin.get();
}

想起一个问题，调用别人写的插件的时候，怎么判断，
this.$myPlugin是Vue原型对象属性方法还是Vue实例属性方法呢？

可以用如下代码来确认：

!this.hasOwnProperty('$myPlugin') && ('$myPlugin' in this)

如果 this.hasOwnProperty('$myPlugin')===false 且 ('$myPlugin' in this) 那么认为 $myPlugin就是原型对象方法，而不是实例方法。

我们知道，
1. obj.hasOwnProperty(‘属性名’) 用于检查给定的属性是否存在于当前实例对象中，（而不是实例原型中）（解释来至：javascript高级程序设计第三版第三章Object）。如果是返回true,如果不是返回 false。
而
2. in 操作符用来判断某个属性属于某个对象，可以是对象的直接属性，也可以是通过prototype继承的属性。如：(属性名 in 对象) ，不管属性是原型的还是实例的，只要存在就会返回ture；否则返回false。

所以用两者结合，就可以判断某个属性是否是原型上的属性。

看栗子，瞬间明白：

class Point {
    constructor() {
        this.x = 'a';
        this.y = 'b'
    }

    getId() {
        return '1';
    }
}

function isPrototypeAttr(obj,pro)
{
    return !obj.hasOwnProperty(pro) && (pro in obj)
}
let p1 = new Point();
console.log(isPrototypeAttr(p1,'toString'));    //true  
console.log(isPrototypeAttr(p1,'getId'));    //true
console.log(isPrototypeAttr(p1,'x'));    //false

//所以toString,getId是原型对象属性。x就是实例对象属性！