精华内容
下载资源
问答
  • 那么为什么构造函数创建的对象都可以访问构造函数原型的,因为使用构造函数创建的对象有一个属性(__proto__),这个属性指向构造函数原型 读取: 对象读取属性时,会先对象本身查找有...

    在JS中,每个函数都有自己的原型对象(prototype),构造函数也是一个函数,所以它也有原型

    原型的读写

    当给构造函数原型设置属性时,使用这个构造函数创建出来的对象都有权访问构造函数的原型对象

    那么为什么构造函数创建的对象都可以访问构造函数的原型的,因为使用构造函数创建的对象有一个属性(__proto__),这个属性指向了构造函数的原型

    读取:

    对象在读取属性时,会先在对象本身查找有没有这个属性,如果没有,就会一层一层往构造函数的原型上找(原型链),直到找完所有的原型链。

    如果对象本身和原型链上都有这个属性,当在对象本身上找到了这个属性,就不会再继续往上层原型链上找了

     

    附一张自己画的原型关系图

    原型关系图

    简单说一下这个图:使用Student自定义构造函数创建一个对象S1,S1的__proto__属性指向了Student构造函数的原型,Student构造函数原型中的constructor属性又指向了Student这个构造函数(所以也可以用S1.constructor来查看S1对象的类型),使用Student构造函数new对象时,Student构造函数会隐性使用 new Object()创建对象原型,所以Student的原型里也会有一个__proto__属性,这个属性指向了Object的原型对象,这就是原型链。

    ps:(感觉我越说越乱)

     

     

    小白一个,有问题指出来大家一起学习进步

    展开全文
  • 文章目录this全局作用域下this就是window函数执行的时候,看前面是否有.如果有this就是.前面的,如果没有就是window(非严格模式下),严格模式下...构造函数(类)的this指的就是当前的实例通过bind,call,app

    this

    在全局作用域下this就是window

    console.log(this);//window
    

    函数执行的时候,看前面是否有.如果有this就是.前面的,如果没有就是window(非严格模式下),在严格模式下(undefined)

     //"use strict";严格模式,此时注释掉了
    function fn(){
        console.log(this);
    }
    var obj={
        "name":"li",
        fn:fn
    }
    
    obj.fn();//{ name: 'li', fn: [Function: fn] }
    fn();//window     如果是严格模式就是undefined
    

    给元素绑定事件的时候,当事件触发,函数执行的时候,里面的this就是当前点击元素

    ele.onclick=function(){
    console.log(this);//当前点击的元素
    }
    

    自执行函数中的this是window(非严格模式下),在严格模式下为undefined

    (function(){
    console.log(this);//非严格模式下为window,严格模式下为undefined
    })()
    

    回调函数,无论是严格模式还是非严格模式,他的this都是window

    "use strict"
    setTimeout(function(){console.log(this);},1000);//window
    
    什么是回调函数?

    把一个函数当成一个参数传给另一个函数,例如:

    "use scrict"
    function fn(callback){
    console.log(this);//undefined
    callback();
    }
    fn(function(){console.log(this)});//undefined
    //严格模式下是undefined  非严格是window*2
    

    构造函数(类)中的this指的就是当前的实例

    function fn(name){
        this.name=name;
    }
    var f1=new fn("1");//{name:"1"}
    var f2=new fn("2");//{name:"2"}
    console.log(f1,f2,fn);//{name:"1"} {name:"2"} fn(name){this.name:name;}
    

    通过bind,call,apply可以改变this的指向

      function fn(){
          console.log(this);
      }
      var obj={
          name:"li",
          fn:fn
      }
      fn.call(obj);//{ name: 'li', fn: [Function: fn] }
      fn.apply(obj);//{ name: 'li', fn: [Function: fn] }
    

    箭头函数中没有this也没有arguments,但是在箭头函数中用到this会向上级查找

    demo练习
    var num=10;
    var obj={num:20};
    obj.fn=(function(num){
       this.num=num*3;
       num++;
       return function(n){
           this.num+=n;
           num++;
           console.log(num);
       }
    })(obj.num);
    var fn=obj.fn;
    fn(5);//22 这里的this是window
    obj.fn(10);//23 这里的this是obj
    console.log(num,obj.num)//65 30
    

    单例设计模式

    单例模式:可以把描述一个事物的所有属性放到一个对象中,这样避免了相互的干扰,这种设计模式就是单例设计

    var obj1={
        name:"cui",
        sex:"男"
    }
    var obj2={
        name:"yang",
        sex:"男"
    }
    
    高级单例模式
    var utils=(function(){
    函数.........
    return {
        name:"yang",
        sex:"男"
    }
    })()
    utils.name;
    

    工厂模式(函数封装)

    将一个重复执行的事,封装成一个函数

    function person (name,age,sex){
        return {
            name:name,
            age:age,
            sex:sex
        }
    }
    var p1=person("李",12,"男");
    var p1=person("王",18,"女");
    

    构造函数

    当函数执行的时候,前面一旦加了new,就变成了构造函数(类)
    f1,f2变成了实例,实例是对象数据类型
    如果函数执行的时候没有形参,可以把()省去
    实例和实例是不相等的,空间地址不同
    在构造函数中,通过this添加的属性名和属性值都是添加给了当前的实例,且都是私有的,构造函数中的this就是当前实例,

    function fn(){
        return 1;
    }
    var f1=new fn();
    var f2=new fn();
    console.log(f1,f2,fn);
    

    构造函数执行的过程

    1. 形成一个私有作用域
    2. 形参赋值
    3. 变量提升
    4. 独有的,开辟一个堆内存,并且把函数里面的this指向这个堆内存(隐形的)
    5. 代码自上而下执行
    6. 把这个对象return返回(隐形的)

    构造函数中的return

    构造函数中一般情况下不要写return,如果写了,注意:
    • 如果return基本数据类型就不会覆盖原来的
    • 如果return引用数据类型,实例的结果就会改变为手动return的那个引用数据类型
    • 如果只写return,那么不会覆盖原来的
    function fn(name){
        this.name=name;
    }
    var f1=new fn("li");
    console.log(f1)//{name:"li"}
    
    function fn(name){
        this.name=name;
        return {age:18}
    }
    var f1=new fn("li");
    console.log(f1)//{age:18}
    
    function fn(name){
        this.name=name;
        return 1;
    }
    var f1=new fn("li");
    console.log(f1)//{name:"li"}
    
    function fn(name){
        this.name=name;
        return
    }
    var f1=new fn("li");
    console.log(f1)//{name:"li"}
    

    判断是否属于一个类

    用法:实例 instanceof 类
    返回结果:布尔数据类型,true就属于,false不属于

    function fn(){
        return 1;
    }
    var f1=new fn();
    console.log(f1 instanceof fn);//true
    

    判断某个对象是否拥有某个属性in

    用法:属性名 in 对象名
    结果:布尔

    检测某个属性是不是对象私有的hasOwnProperty

    用法: 对象.hasOwnProperty(“属性名”)
    返回值:布尔,不是私有的或者属性不存在都为false,是私有的就是true

    function Fn(name,age){
        this.name=name;
        this.age=age;
    }
    
    var f1=new Fn("lili",18); 
    f1.hasOwnProperty("name");// true
    f1.hasOwnProperty("toString");//fasle
    
    创建数组的两种方式及注意事项

    使用构造函数时,new Array()里的值如果有1个就是数组的长度(且每个项都为empty空的),如果有多个就是数组的每个项

    var ary1=[1,2,3];
    var ary2=Array(1,2,3);
    var ary3=Array(5);
    console.log(ary1,ary2,ary3)//[ 1, 2, 3 ] [ 1, 2, 3 ] [emptyx5]
    
    js创建值的两种方式
    • 字面量方式:var obj={}
    • 基于构造函数: var obj2=new Object()
    • 不管是哪种形式创建的,这些对象都是Object的一个实例。
    • 注意:基本数据类型用字面量方式创建的实例,不是标准的实例,用instanceof检测为false,但是可以调用类的方法,如果用构造函数创建类,用instanceof检测为true
    • 注意:引用数据类型,两种方式创建都可以被instanceof检测为true
    var n1=1;
    var n2=new Number(1);
    
    console.log(typeof n1);//"number"
    console.log(typeof n2);//"object"
    
    n1.toFixed(2);//"1.00"
    
    n2.toFixed(2);//"1.00"
    

    原型和原型链

    • 【函数数据类型】
      • 普通函数、构造函数、箭头函数
    • 【对象】
      • 普通的对象、数组、时间对象、正则…
      • prototype/_ _ proto _ _原型属性值也是对象,但不包含(function.prototype)
      • 实例(不包括7种原始数据类型)
        • 如10是Number的实例,但不是一个对象
    • 大部分函数(重点是构造函数)都有一个属性prototype(是原型,也可称为显式原型),他是属性是一个对象数据类型,浏览器会默认给他开辟一个堆内存存的是公有的属性属性和方法,供当前类所属实例调用
    • 箭头函数没有prototype属性
    • prototype天生自带一个属性constructor,指的是当前的构造函数(所属的类)
    • 所有对象都天生自带一个_ _ proto _ _属性,他指向当前实例所属的原型,找到最后时,__ proto__为null

    原型链查找:

    先看自己私有的有没有,如果没有,基于__proto__向上查找,(简单概括为先找私有,再看公有)如果一直没找到就为undefined

    function Fn(){
       var n=100;
       this.A=function(){console.log("私有A")};
       this.B=function(){console.log("私有B")}
    }
    Fn.prototype.A=function(){console.log("公有A")};
    var f1=new Fn();
    var f2=new Fn();
    console.log(f1.A==f2.A);
    console.log(f1.__proto__.A==f2.__proto__.A);
    console.log(f1.__proto__.A==Fn.prototype.A)
    

    图解
    在这里插入图片描述

    展开全文
  • 介绍一下JavaScript 原型、原型链原型链什么特点? 构造函数原型 prototype ...当我们使用构造函数新建一个对象后,这个对象的内部将包含一个指针,这个指针指向构造函数的 prototype 属性对应的值

    介绍一下JavaScript 原型、原型链?原型链有什么特点?

    构造函数原型 prototype
    对象原型 __ proto __
    
    回答思路:
    1.构造函数原型
    2.对象原型
    3.原型链
    4.原型链的特点
    

    在 js 中我们是使用构造函数来新建一个对象的,每一个构造函数的内部都有一个 prototype 属性,指向另一个对象,这个对象包含了可以由该构造函数的所有实例共享的属性和方法。

    当我们使用构造函数新建一个对象后,在这个对象的内部将包含一个指针,这个指针指向构造函数的 prototype 属性对应的值,这个指针称为对象的原型。一般来说我们是不应该能够获取到这个值的,但是现在浏览器中都实现了 proto 属性来让我们访问这个属性,但是我们最好不要使用这个属性,因为它不是规范中规定的。ES5 中新增了一个 Object.getPrototypeOf() 方法,我们可以通过这个方法来获取对象的原型。

    当我们访问一个对象的属性时,如果这个对象内部不存在这个属性,那么它就会去它的原型对象里找这个属性,这个原型对象又会有自己的原型,于是就这样一直找下去,也就是原型链的概念。原型链的尽头一般来说都是 Object.prototype

    image-20200630114115388

    原型链的特点:
    原型链实现了继承。JavaScript 对象是通过引用来传递的,我们创建的每个新对象实体中并没有一份属于自己的原型副本。当我们修改原型时,与之相关的对象也会继承这一改变。

    展开全文
  • 是一个对象,js规定,每一个 构造函数都有一个prototype属性,指向另一个对象,这个对象的所有属性和方法,都会被构造函数所拥有。 闭包 闭包是什么:内层函数访问外层函数的变量 闭包的作用: 延申变量的使用范围 ...

    原型链

    当调取一个对象的属性时,会先在本身查找,若无,就根据 __proto__找到构造原型,若无,继续往上找。最后会到达顶层Object prototype,它的__proto__指向null。

    由__proto__ 串起的路径就是原型链

    原型

    是一个对象,js规定,每一个 构造函数都有一个prototype属性,指向另一个对象,这个对象的所有属性和方法,都会被构造函数所拥有。

    闭包

    闭包是什么:内层函数访问外层函数的变量
    &&一个作用域访问另外一个函数内部的局部变量
    闭包的作用: 延申变量的使用范围
    闭包的弊端:造成内存泄漏(变量没有被销毁)

    this指向问题

    两个原则没变

    • 构造函数中的this指向实例对象
    • 其他函数中的this指向调用者
      • 定时器中的函数的调用者是window
      • 立即执行函数的调用者是window

    类的继承(使用原型对象)

    • 子构造函数使用call方法调用父级构造函数继承父类的属性
    // 2 .子构造函数 
    function Son(uname, age, score) {
      // this 指向子构造函数的对象实例
      Father.call(this, uname, age);
    }
    
    • 通过子构造函数的原型对象继承父构造函数的方法
    Son.prototype = new Father();
    // 如果利用对象的形式修改了原型对象,别忘了利用constructor 指回原来的构造函数
    Son.prototype.constructor = Son;
    
    展开全文
  • js 原型 原型链 原型 解释: 原型是首创的模型,...原型对象有一个指向构造函数的的属性——constructor。这里的函数不光包括构造函数,也包括普通函数。 原型对象拥有公有的属性和方法 js 继承是基于原型对象
  • 访问一个属性时,会先实例本身查找该属性,如果没有,就到其原型对象去查找,若还是没有会去构造这个对象的构造函数中去查找,如果没有就这个构造函数中的prototype去找,如果还是没有就到Object对象去找...
  • prototype 隐式原型:__proto__js万物皆对象,方法(Function)是对象,方法的原型(Function.prototype)是对象,对象具有属性(__proto__)称为隐式原型,对象的隐式原型指向构造该对象的构造函数的显式原型。...
  • 通过构造函数实例化出来的对象,并不具有prototype属性,其默认有一个__proto__属性,__proto__的值指向构造函数的原型。在原型对象上添加或修改的属性,在所有实例化出的对象上都可共享。 /*代码基本架构 1.每个...
  • 了解原型链什么之前我们先了解一下原型的关系 JavaScript 的每个函数都会有一个 prototype 属性,这个属性又会返回一个原型,原型又有一个 constructor 属性,这个属性指向与之关联的构造函数。通过构造...
  • JS的原型及原型链

    2020-05-25 18:54:17
    __proto__: 隐式原型, 每一个引用类型(数组、函数、对象)都有一个__proto__属性,指向构造函数原型对象 扩展: 所有引用类型,它的’_ _ proto_ _'属性指向它的构造函数的’prototype’属性 原型的作用:数据...
  • 指向构造该对象的构造函数的原型(prototype) 原型链 javascript,每个函数都会初始化一个属性:原型(prototype),当我们需要访问这个函数的某个属性时,就会去到prototype寻找该属性,若
  • JavaScript原型链

    2020-10-27 23:17:00
    如果构造函数或对象A,A的属性指向构造函数或对象B,B的原型再指向构造函数或对象C,以此类推,最终的构造函数或对象的原型指向Object的原型。由此形成一条链状结构,被称之为原型链。按照上述的描述,B定义的...
  • 划重点:构造函数.prototype===实例对象.proto 思考问题? 对象访问属性怎么访问的?...prototype是原型,而_proto_是一个隐形原型指向构造函数中的prtotype,所以这两个一摸一样 函数Function也是一个构造函数 ...
  • 原型链

    2019-08-14 11:13:17
    JavaScript ,每个构造函数都有一个prototype 属性,这个属性指向函数的原型对象(原型)。使用原型对象的好处是所有对象实例共享它所包含的属性和方法。 什么原型链原型链解决的主要是继承问题。 每个...
  • 声明了一个函数后,这个构造函数(声明了的函数)会有一个属性prototype,这个属性指向的就是这个构造函数(声明了的函数)对应的原型对象;原型对象有一个属性constructor,这个属性指向的是这个构造函数...
  • 原型、原型链和继承

    2019-05-29 18:17:06
    什么是原型、原型链、继承 1.原型:当每一个函数创建时,都会给函数设置一个prototype(原型)属性,这个属性是一个指针,指向一个对象,这个对象包含所有实例共享的属性和方法,默认情况下,都会为prototype对象添加一个...
  • 原型和原型链

    2021-01-02 17:51:48
    对于构造函数来讲,每通过构造函数实例化一个对象,都有一个隐藏的属性,指向构造函数原型对象。他们两个是全等的关系,实例化对象.__proto === 构造函数.prototype 原型对象就好像是一个公共区域,他可以被每一...
  • 要弄清楚原型链就要先弄清楚 function 类型,javascript没有类的概念,都是函数,所以它是一门函数式的编程语言。类有一个很重要的特性,就是它可以根据它的构造函数来创建以它为模板的对象。javascript,...
  • prototype会自动获得一个constructor属性,指向构造函数。 其中,person1为Person的一个实例。 -hasOwnProperty() :此方法可以用于检测一个属性是存在于实例还是原型中。若来自实例则返回true -in操作符: ...
  • 函数有原型原型存放一些公共属性和方法,函数的本质也是一个对象,函数对象内部有一个prototype指针指向原型,并且构造函数创建的实例对象__proto__也指向这个原型对象, 原型对象有constructor指向函数本身...
  • javascript构造函数

    2018-11-28 09:31:32
    constructor是原型对象上的一个属性,默认指向这个原型构造函数 这个结论貌似对我们平时的工作似乎并没有什么用处,那构造函数,就真的没什么用处吗? 今天 使用构造函数构造可以复用的对象 JS的函数即可以是...
  • js万物皆对象,方法(Function)是对象,方法的原型(Function.prototype)是对象,对象具有属性(__proto__)称为隐式原型,对象的隐式原型指向构造该对象的构造函数的显式原型。 方法(Function)是一个特殊的...
  • 初级原型链

    2020-12-18 18:54:41
    原型链 什么原型链: 1.所有的实例对象都有__proto__属性, 它指向的就是其构造函数的原型对象 2.这样通过__proto__属性就形成了...4.当给对象属性赋值时不会使用原型链, 而只是当前对象进行操作 初级原型链 ...
  • JavaScript的对象和原型链

    千次阅读 2020-02-20 18:18:55
    默认情况下,所有原型对象都会自动获得一个 constructor(构造函数)属性,这个属性包含一个指向prototype 属性所在函数的指针。 创建对象的几种方法 通过字面量方式创建 var person={ ...
  • 什么是prototype & __proto__ prototype是显式原型对象,一般... JS 是没有类的概念的,而是通过__proto__ 将对象和原型联系起来组成原型链来实现类似继承的方式。 这里生成的a 其实是由构造函数Array构造...
  • 详谈JavaScript原型链

    2020-10-13 02:06:25
    JS只有实现继承,而其中主要就是通过原型链实现的。由此,原型链有多重要就不言而喻了。 构造函数、原型、实例 先明确几个点(构造函数、原型、实例): 每个构造函数都有一个原型对象(prototype),原型对象会...
  • 原型与原型链

    2019-05-26 16:37:00
    函数的 prototype 属性指向了一个对象,这个对象正是调用该构造函数而创建的实例的原型,也就是这个例子的 person1 和 person2 的原型原型什么原型呢?你可以这样理解:每一个JavaScript对象(null除外)...
  • 原型和原型链 什么是原型? 每一个构造函数里面都有一个属性叫做prototype,它的值就是一个对象,这个对象我们叫做原型对象。 什么是原型链?...在原型链中有这样两个公式 var arr=new Array(1,2,3)
  • js之原型,原型链

    2018-08-22 16:50:00
    在构造函数创建出来的时候,系统会默认的创建并关联一个对象,这个对象就是原型原型对象默认是空对象 默认的原型对象会有一个属性constructor指向构造函数 原型的作用 原型对象的成员,可以被使用和它关联...

空空如也

空空如也

1 2 3 4 5 ... 7
收藏数 138
精华内容 55
关键字:

在原型链中什么指向构造函数