再学JS|青训营笔记

67 阅读2分钟

这是我参与「第四届青训营 」笔记创作活动的第4天

上课感受

上次我们学习了基本的JS的语法,用处,功能,仅仅是学习了皮毛。今天主要是一些比较深入的一些东西,我自学前端的时候并没有学到的东西,因为我那个时候学到JS的用法和基本语法就没有再去继续学习JS,今天这次让我可以弥补那时的不足。

构造函数

什么是构造函数:当一个普通函数创建一个类对象是,那么就程它为构造函数。 特点:默认首字母大写使用new关键字来调用,并返回一个实例对象,内部使用this来构造属性和方法this指向返回的新对象。

function Person(name){
    this.name = name
    this.eat = function(){
         console.log("方法")
    }
}
    
let per = new Person("小小")
per.eat()       

原型

为什么需要原型:在一些场景中,比如人类行为有些要打游戏,有些要上学,有些要工作,但同时他们都需要吃饭和睡觉,但如果把每个人吃饭睡觉私有化使用的话就有点浪费内存,这时候就可以把这些每个人都需要做的行为统一拿出来放到一个公共的空间,每个人都有权限访问它,这样就可以节省内存。而实现共享的,这个时候就用到了原型 prototype。什么是原型:每个函数对象都有一个prototype属性,这个属性的指向被称为该函数对象的原型对象,简称原型。

原型链

原型链是 JavaScript 作者为了继承而设计的。由上边的分析,const foo = new Foo() 语句,其实是产生了一个链条的。

console.log(typeof foo.toString);//function

console.log(typeof foo.hasOwnProperty); //function

原因是:JavaScript 在设计之初,proto就是用来查找属性和方法的。

从上图的链条来看,我们在foo这个对象中,查找 toString 方法,没找到,就循着foo.proto查找,foo.proto 里也没有找到,就循着foo.proto.proto找,这个时候找到了,则调用;如果还找不到,就再往上找,即foo.proto.proto.proto,这个时候值为null,查找结束。 这就是原型链,我们也可以说,Foo继承了Object,所以foo中能访问到 Object 的原型属性。