js高级-面向对象继承

目的:1、节省内存空间,2、实现数据共享

原型链:实例与原型的链条称作 原型链

原型对象的constructor属性指向构造函数本身,让学生原型指向人的构造函数。

原型的指向可以发生改变

原型链最终指向了null

构造函数继承

call方法的作用

1、函数名.call()可以实现函数的调用

2.call()会改变this指向,如果没有参数this指向window

3.call()会改变this指向,如果有参数this指向该参数

Call方法实现继承

4、call()会改变this指向,如果有参数this指向该参数中第一个参数,剩下的参数是个参数列表

我们可以通过call方法改变this指向的特性去实现继承, 构造函数中的this指向实例化对象,所以this指向实例学生。此时,通过call方法让人构造函数中的this指向学生即可。

 function Student(score, name, age) {
    this.score = score;
    this.study = function () {
      console.log(this.name + "爱学习!");
    }
    Person.call(this, name, age);
  }
  1. 深拷贝与浅拷贝

  2. 1.javascript变量包含两种不同数据类型的值:基本类型和引用类型。

    基本类型值指的是简单的数据段,包括es6里面新增的一共是有6种,具体如下:number、string、boolean、null、undefined、symbol。

    引用类型值指那些可能由多个值构成的对象,只有一种如下:object。
    在将一个值赋给变量时,解析器必须确定这个值是基本类型值还是引用类型值。

    2.javascript的变量的存储方式:栈(stack)和堆(heap)。

    栈:自动分配内存空间,系统自动释放,里面存放的是基本类型的值和引用类型的地址

    堆:动态分配的内存,大小不定,也不会自动释放。里面存放引用类型的值。

        基本类型占用空间固定,保存在栈中(当一个方法执行时,每个方法都会建立自己的内存栈,在这个方法内定义的变量将会逐个放入这块栈内存里,随着方法的执行结束,这个方法的内存栈也将自然销毁了。因此,所有在方法中定义的变量都是放在栈内存中的;栈中存储的是基础变量以及一些对象的引用变量,基础变量的值是存储在栈中,而引用变量存储在栈中的是指向堆中的数组或者对象的地址,这就是为何修改引用类型总会影响到其他指向这个地址的引用变量。

    基本数据类型是按值访问的,因为可以操作保存在变量中的实际的值。
    引用类型的值是保存在内存中的对象。JavaScript 不允许直接访问内存中的位置,也就是说不能直接操作对象的内存空间。 在操作对象时, 实际上是在操作对象的引用而不是实际的对象。

    基本类型与引用类型最大的区别实际就是 传值与传址 的区别

    值传递:基本类型采用的是值传递。

    引用类型占用空间不固定,保存在堆中(当我们在程序中创建一个对象时,这个对象将被保存到运行时数据区中,以便反复利用(因为对象的创建成本通常较大),这个运行时数据区就是堆内存。堆内存中的对象不会随方法的结束而销毁,即使方法结束后,这个对象还可能被另一个引用变量所引用(方法的参数传递时很常见),则这个对象依然不会被销毁,只有当一个对象没有任何引用变量引用它时,系统的垃圾回收机制才会在核实的时候回收它
    地址传递:引用类型则是地址传递,将存放在栈内存中的地址赋值给接收的变量。

  3. 、浅拷贝

  4. 定义:被复制对象的所有变量都含有与原来的对象相同的值,而所有的对其他对象的引用仍然指向原来的对象。即对象的浅拷贝会对“主”对象进行拷贝,但不会复制主对象里面的对象。”里面的对象“会在原来的对象和它的副本之间共享。

    基本数据类型Number(赋值操作)

    var a=1; 

    var b=a; 

    b //1 

    b=2;

    b //2

     a //1

    数组

    var arr1 = [1,2,3];

     var arr2 = arr1; 

    arr2 //[1,2,3] 

    arr2.push(4); 

    arr2 //[1,2,3,4] 

    arr1 //[1,2,3,4]

    首先栈内存arr1会指向堆内存里的数组,栈内存的arr1保存的是数组的引用,也就相当于内存地址,arr2=arr1,会把arr1的引用赋给arr2,所以arr2也有了数组的引用,此时arr1和arr2指向的是同一个数组,因此一个数组的改变会影响另一个数组的值。

    对象

    var obj1={count:1,name:'grace',age:1}; 

    var obj2 = obj1; 

    obj2 //{count:1,name:'grace',age:1}

    obj2.count=2; 

    obj1 //{count:2,name:'grace',age:1} 

    obj2 //{count:2,name:'grace',age:1}

    综上所述,如果是基本数据类型,直接进行赋值操作,这样就相当于在栈内存中重新开辟了一个新的空间把值传递过去;如果是引用类型的值传递,进行的就是浅拷贝,浅拷贝赋值的只是对象的引用,如上述obj2=obj1,实际上传递的只是obj1的内存地址,所以obj2和obj1指向的是同一个内存地址,所以这个内存地址中值的改变对obj1和obj2都有影响。

  5. 、深拷贝

  6. 定义:深拷贝不仅将原对象的各个属性逐个复制出去,而且将原对象各个属性所包含的对象也依次采用深复制的方法递归复制到新对象上,所以对一个对象的修改并不会影响另一个对象。

    数组(注意:该数组只是单纯的数组,如果数组里面嵌套对象,则下面的几种方法都不是深拷贝。) 

    法一:for循环

    var arr1 = [1,2,3];

    var arr2 = copyArr(arr1);

     function copyArr(arr){ 

        var res=[]; 

        for(var i=0,length=arr.length;i<length;i++)

        { 

            res.push(arr[i]); 

        } 

    return res; }

    法二: slice

    var arr1 = [1,2,3]; 

    var arr2 = arr1.slice(0);

    法三: concat

    var arr1 = [1,2,3]; 

    var arr2 = arr1.concat();

    对象

    法一:for循环

    let obj1={count:1,name:'grace',age:1}; 

    let obj2 = copyObj(obj){

     let res = {}; 

    for(let key in obj){ 

    res[key]=obj[key]; }

     return res; }

     

  7. 拷贝继承

  8. 定义:深拷贝不仅将原对象的各个属性逐个复制出去,而且将原对象各个属性所包含的对象也依次采用深复制的方法递归复制到新对象上,所以对一个对象的修改并不会影响另一个对象。

    利用对象的深拷贝方式即可,可以继承父类中构造函数和原型中的所有的属性和方法。

  9.  for (x in p1) {
    
        // 对象的属性
    
        // console.log(x);
    
        // 对象的属性值
    
        console.log(p1[x]);
    
        // 只需要拷贝属性值即可
    
        stu1[x] = p1[x];
    
      }

  10. 函数内this的指向

  11. 调用方式

    非严格模式

    备注

    普通函数调用

    window

    严格模式下是 undefined

    构造函数调用

    实例对象

    原型方法中 this 也是实例对象

    对象方法调用

    该方法所属对象

    紧挨着的对象

    事件绑定方法

    绑定事件对象

    定时器函数

    window

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值