js 面向对象编程陷阱2

来源：互联网发布：程序员简历怎么写编辑：程序博客网时间：2024/06/05 02:07

观察如下代码：

<!DOCTYPE html><html><head><meta charset="utf-8" /><title></title></head><body><script>    function A()    {        A.prototype.get = function ()        {            return 1 ;        }    }//步骤一：  先生成一个A的实例，检验其原型函数        var a1 = new A();        console.log(a1.get());      // 1                        //步骤二：修改Ａ的原型函数，并验证其已经生效        A.prototype.get = function ()        {            return 2 ;        }        console.log(a1.get());     // 2                        //步骤三：再生成一个A的实例，由于A的构造器中包含原型函数的定义体        //所以，生成实例的同时，步骤二的结果被恢复        var a2 = new A();        console.log(a1.get());    // 1        console.log(a2.get());    // 1</script></body></html>

>>陷阱

如果在A的构造器内部声明原型函数，则每生成A的实例的时候，原型函数都会被重新声明一次。

这是没有意义的动作，或多或少影响js的执行性能。

应将原型函数的定义体从构造器中移出，如下：

<!DOCTYPE html><html><head><meta charset="utf-8" /><title></title></head><body><script>    function A(){}        A.prototype.get = function ()        {            return 1 ;        }//步骤一：  先生成一个A的实例，检验其原型函数        var a1 = new A();        console.log(a1.get());      // 1                        //步骤二：修改Ａ的原型函数，并验证其已经生效        A.prototype.get = function ()        {            return 2 ;        }        console.log(a1.get());     // 2                        //步骤三：再生成一个A的实例，由于A的构造器中包含原型函数的定义体        //所以，生成实例的同时，步骤二的结果被恢复        var a2 = new A();        console.log(a1.get());    // 2        console.log(a2.get());    // 2</script></body></html>

阅读全文

0 0

js 面向对象编程 陷阱2

js 面向对象编程陷阱2