js 对象方法、类方法、原型方法的区别

55 阅读1分钟
       function People(name) {
            this.age = 20
            this.name = name
            this.objectFn = function() {
                console.log('对象方法')
            }
        }
        People.classFn = function() {
            console.log('类方法')
        }
        People.prototype.prototypeFn = function() {
            console.log('原型方法')
        }
        /**
         * 构造函数调用
        */
        // People.objectFn() // 报错 is not a function, People.objectFn 是undefined
        People.classFn()
        // People.prototypeFn() // 报错 is not a function, People.prototypeFn 是undefined
        /**
         * 实例调用
        */
        const p1 = new People('zhangsan')
        p1.objectFn()
        p1.prototypeFn()
        // p1.classFn()  // 报错 is not a function, People.classFn是undefined

        class Person{
             constructor(name, age) { // 构造方法
                this.name = name
                this.age = age
                this.objectFn = function() {
                    console.log('对象方法')
                }
             }
             static classFn() { // 静态方法
                 console.log('类方法,静态方法')
             }
             prototypeFn() { // 普通方法
                 console.log('原型方法')
             }
         }
         console.log(Person.objectFn) // undefined
         Person.classFn() // 类方法,静态方法
         console.log(Person.say) // undefined
         const p1 = new Person('tom', 18)
         p1.objectFn() // 对象方法
         console.log(p1.classFn) // undefined
         p1.prototypeFn() // 原型方法