js面向对象编程

js面向对象编程




属性比如人自身拥有的东西

方法就比如人可以吃饭睡觉等

对象就相当于众多人中的一个人

 f.prototype--》指向一个内存地址---》地址中存着对象



js面向对象编程


用构造器创建的是函数对象 其他是普通对象  

js面向对象编程

这里的局部变量n在外部访问不到

为了访问到就使用闭包


js面向对象编程



为了证明一直保留在内存中 再来看下面的例子

js面向对象编程这三步一直有n存在



闭包优缺点

优点:有利于封装 可以访问局部变量

缺点:内存浪费严重 内存泄漏


请问为什么没赋值给变量直接调用跟赋值变量调用变量结果不一样?

function fn1(){
        var i = 0;
        function fn2(){
            console.log(++i)
        }
        return fn2;
    }
    console.log(fn1()); // function fn2(){}
    var num = fn1(); 
    num();   // 1


注意了var num = fn1();这里的等号后面,不是函数名,是函数调用,这句话会先执行等号后面的函数调用,返回函数fn2,然后赋值给变量num,变量num指向的是fn2函数的内存地址。调用num,等同于调用fn2函数


再看下面的问题

<script>
    var a = 111;
    function f(){
        console.log(a);
        var a = 11;
        function b() {
            console.log(a);
        }
        return b;
    }
   // f();//undefined
    f()();//undefined 11
</script>


如果去掉var a = 11;

<script>
    var a = 111;
    function f() {
        alert(a);

        function b() {
            alert(a);
        }
        return b;
    }
    f()();//111 111
</script>



再来一个

<script>
    var a = 111;
    function f() {
        var a = 10;
        function b() {
            a++
            alert(a);
        }
        return b;
    }

    var fun = f();
    fun();
    fun();//依次弹出11 12
</script>




声明对象的方式


①字面式

js面向对象编程

例如

js面向对象编程



②new 操作符

js面向对象编程

例如

js面向对象编程


③构造方法

js面向对象编程

例子:

js面向对象编程



问题:这三种方法的优劣?分别应该用在什么场景?

一般情况下常用的有以下三种:

(1)使用内置对象
(2)使用JSON符号
(3)自定义对象构造 

但是这个需要根据需求来选择



④工厂模式

js面向对象编程

例子

js面向对象编程


*****

js面向对象编程



⑤原型模式声明

js面向对象编程



例子

js面向对象编程


或者这样写也可以

js面向对象编程




⑥混合写法:构造加原型


js面向对象编程




例如

js面向对象编程

在实际中 单纯的构造或者单纯的原型不太多    混合用的多一些








对象的遍历

js面向对象编程


问题下面两段代码分别输出什么?


js面向对象编程





js面向对象编程



对象是怎么存储的呢?

js面向对象编程





封装

js面向对象编程

js中没有直接提供封装的关键字   但是可以通过闭包来封装



先来看这个例子

js面向对象编程

会报错 n没有定义


修改一下

js面向对象编程

这样就可以再外部成功alert n了  但这里还不是完整的闭包


js面向对象编程



再看一个例子

js面向对象编程



js面向对象编程

两次打印的都是 2


问:

js面向对象编程

能正常打印1的是 console,log(test.subTest()());





原型

js面向对象编程


例子

js面向对象编程


完整的原型链

js面向对象编程



原型继承

js面向对象编程




构造继承

在子类内部构造父类的对象实现继承

js面向对象编程

父对象被子对象继承  所有属性和方法 都会传到子对象中


call apply方法

js面向对象编程

定义看起来类似  实际也是类似  只是传参不同


js面向对象编程



js面向对象的关键词


instanceof

js面向对象编程


delete

js面向对象编程



call apply

第一个例子

js面向对象编程



第二个例子

js面向对象编程



callee

js面向对象编程



arguments

js面向对象编程

.



this

js面向对象编程


js面向对象编程


js面向对象编程




对象冒充

js面向对象编程


实际中用的不多  有人喜欢问