当前位置: 首页 > 科技观察

这6个知识点让我对JavaScript对象有了更深的理解

时间:2023-03-20 11:20:01 科技观察

1。对象方法和此方法只是保存函数值的属性。简单对象方法letrabbit={};rabbit.speak=function(line){console.log("小兔子说:"+line);};rabbit.speak("我还活着。")输出:TLittle兔子说:我还活着。Objectmethods&this当一个函数作为一个方法被调用时,这个对象会将这个函数作为一个属性并被立即调用,就像在object.method()中一样,它的body中的特殊变量this会指向被调用的对象.functionspeak(line){console.log(this.type+"小兔子说:"+line)};letwhiteRabbit={type:"white",speak:speak}whiteRabbit.speak("哦,我好可爱!")输出:小白兔说:哦,我好可爱!apply&callfunctionspeak(line){console.log(`${this.type}的小兔子说:${line}`);};letwhiteRabbit={type:"white",speak:speak};speak.apply(whiteRabbit,["你这个小坏蛋!"]);speak.call({type:"black"},"嘿,我不坏,你不爱我!");小白兔说:你这个小坏蛋!小黑兔说:嘿,我不坏,你不爱!2.原型(prototype)几乎所有的对象都有一个原型原型是另一个对象,当一个对象在没有属性的情况下访问自己时,它会从它的原型中搜索属性,如果没有找到,它就会从其原型的原型继续查找,依此类推,直到为空。一个空对象的prototype原型链最终指向Object的原型,Object中的__proto__为nullletempty={};console.log(empty.toString);console.log(empty.toString());output:[Function:toString][objectObject]其他对象(数组、函数等)的默认属性很多对象并不直接使用Object.prototype作为原型,而是有自己的默认属性。派生数组console.log(Object.getPrototypeOf(isNaN)==Function.prototype);console.log(Object.getPrototypeOf([])==Array.prototype);output:truetrueObject.create创建具有特定原型的对象protoRabbit充当所有兔子共享属性的容器来自其原型的共享属性='killer'killerRabbit.speak('Getreadytodie!')输出:KillerRabbitsays:Getreadytodie!3.Constructor——构造函数原型一个更方便的创建从一些共享原型派生的对象的方法是使用构造函数在JavaScript中,调用一个以new关键字开头的函数将其视为一个构造函数,this变量被绑定到一个新对象,并且除非它显式返回另一个对象值,否则这个新对象将从调用中返回为了将它与其他函数区分开来functionRabbit(type){this.type=type;}letkillerRabbit=newRabbit("killer");letblackRabbit=newRabbit("black");console.log(blackRabbit.type);output:black-默认构造函数有Object.prototype构造函数(实际上是所有函数)自动获取一个名为prototype的属性,它默认情况下包含一个从Object.prototype派生的普通空对象使用此构造函数创建的每个实例都将此对象作为其原型=function(line){console.log(`${this.type}Rabbitsays:${line}`);};blackRabbit.speak("轰...一波王炸!");输出:黑兔说:轰...一波王者轰炸!4.重写派生属性——同名原型如果原型中有同名属性,则不会更改添加到对象的这个属性本身functionRabbit(type){this.type=type;}letblackRabbit=newRabbit("black");letkillerRabbit=newRabbit("killer");Rabbit.prototype.teeth="small";console.log(killerRabbit.teeth);//smallkillerRabbit.teeth="long,sharp,andbloody";console.log(killerRabbit.teeth);//long,sharp,andbloodyconsole.log(blackRabbit.teeth);//smallconsole.log(Rabbit.prototype.teeth);//small下面console.log(blackRabbit.teeth)的结果小,因为blackRabbit对象没有teeth属性,它继承了Rabbit对象自身的teeth属性,取值small5。原型干扰——可枚举和不可枚举letmap={}functionstorePhi(event,phi){map[event]=phi}storePhi('pizza',0.069)storePhi('touchedtree',-0.081)Object.prototype.nonsense='hi'for(letnameinmap){console.log(name)}console.log('nonsense'inmap)console.log('toString'inmap)output:pizzatouchedtreenonsensetruetruetoString没有出现在for/in循环中,但是返回truein运算符,因为JS区分可枚举属性和不可枚举属性。我们通过简单赋值创建的所有属性都是可枚举的,Object.prototype中的标准属性都是不可变的,这就是为什么它们不会像这样出现在for/in循环中。letmap={};functionstorePhi(event,phi){map[event]=phi;}storePhi("pizza",0.069);storePhi("touchedtree",-0.081);Object.defineProperty(Object.prototype,"hiddenNonsense",{enumerable:false,value:"hi"})for(varnameinmap){console.log(name)}console.log(map.hiddenNonsense)输出:pizzatouchedtreehi可以使用Object.defineproperty定义自己的不可枚举属性function,这个函数允许我们控制要创建的属性的类型,在这个例子中hiddenNonsense在地图中,但在for...in中没有显示。—hasOwnPropertyvsinoperatorconstmap={}console.log("toString"inmap)console.log(map.hasOwnProperty("toString"))output:truefalsehasOwnProperty方法告诉我们对象本身是否具有该属性,而无需查看其属性prototype,这通常比in运算符给我们的信息更有用。因此,如果你对基本对象的原型感到困惑,建议你这样写一个for/in循环:for(varnameinmap){if(map.hasOwnProperty(name)){//...thisisanownproperty}}6.无原型对象Object.create函数使我们能够创建具有特定原型的对象。我们也可以传递null作为原型来创建一个没有原型的新对象。因此,我们不再需要hasOwnProperty,因为一个对象拥有的所有属性都是它自己的属性。现在,无论人们用Object.prototype做什么,我们都可以安全地使用for/in循环varmap=Object.create(null);map["pizza"]=0.069;console.log("toString"inmap);//falseconsole.log("pizza"inmap);//trueyou-should-know-about-objects-in-javascript-ccd11a9e1998本文转载自微信公众号《伟大的走向世界》,你可以通过以下二维码关注它。转载请联系****公众号。