search
HomeWeb Front-endJS TutorialJS object attributes related (check attributes, enumeration attributes, etc.)_javascript skills

1. Delete attributes

The delete operator can delete the properties of an object

Copy code The code is as follows:

delete person.age //That is, person no longer has the attribute age
delete person['age'] //or this

Delete only disconnects the attribute from the host object, but does not operate the attributes in the attribute. See that after deleting a.p, b.x is still 1

var a = {p:{x:1}};
var b = a.p;
console.log(a.p.x); //1
delete a.p;
console.log(a.p.x); //TypeError a.p is undefined
console.log(a.p); //undefined
console.log(b.x); //1

delete can only delete own properties, not inherited properties (to delete an inherited property, you must delete it from the prototype object that defines this property. Of course, this will affect all objects that inherit from this prototype)

function inherit(p){ 
  if(p == null){  // 不能从null中继承
    throw TypeError();
  }
  if(Object.create){  //如果有这个方法就直接使用
    return Object.create(p);
  }
  var t = typeof p;
  if(t !== "object" || t !== "function"){  //要继承的对象 类型要符合
    throw TypeError();
  }
  function f(){ }; //定义一个空的构造函数
  f.prototype = p; //原型指向要继承的对象p
  return new f();  //创建f对象,此对象继承自p
}

var obj = {x:1};
var obj1 = inherit(obj);
obj1.y = 2;
console.log("x = "+obj1.x+" y = "+obj1.y); //x = 1 y = 2
delete obj1.x;
delete obj1.y;
console.log("x = "+obj1.x+" y = "+obj1.y); //x = 1 y = undefined

Of course, delete can only be used for configurable properties
For example

delete Object.prototype; // 不能删除 不可配置

var x = 1;
delete this.x; //不能删除
this.y = 1;
delete y; //这样可以删除

function f(){ }
delete this.f; //不能删除

2. Detect attributes

Use "in"

The

in operator expects its left operand to be a string or convertible to a string, and its right operand to be an object

var data = [5,6,7];
console.log("0" in data); //有下标0
console.log(1 in data);  //1可以转换成"1"
console.log("4" in data); //下标只有 1 2 3
 
var obj = {x:1};
console.log("x" in obj); //true
console.log("y" in obj); //false
console.log("toString" in obj); //true 因为obj继承了这个方法

Use hasOwnProperty() or propertyIsEnumerable() --- the latter is an enhancement of the former
Gu Mingsi thought

var obj = {x:1};
console.log(obj.hasOwnProperty("x")); //true
console.log(obj.hasOwnProperty("y")); //false
console.log(obj.hasOwnProperty("toString")); //false 因为obj继承了这个方法,但不是它自己的

Only when it is detected that it is a free attribute and an enumerable attribute, the latter will return true

var obj = {x:1};
console.log(obj.propertyIsEnumerable("x")); //true
console.log(obj.propertyIsEnumerable("y")); //false
console.log(obj.propertyIsEnumerable("toString")); //false 因为obj继承了这个方法,但不是它自己的
console.log(Object.prototype.propertyIsEnumerable("toString")); //false 因为最原始的的 toString就是不可枚举的

Of course, you can also directly use the "!==" operator to determine

var obj = {x:1};
console.log(obj.x !== undefined);//true
console.log(obj.y !== undefined);//false
console.log(obj.toString !== undefined); //true 

3. Enumeration attributes

var obj = {x:1,y:2};
for(p in obj){
 console.log(p);//x y
 console.log(obj.p);// undefined undefined
 console.log(obj[p]);//1 2
} 

Expansion 1:

Each object has its associated prototype, class, and extensibility
To detect whether an object is the prototype of another object (or is in a prototype chain), you can use the isPrototypeOf() method

var p = {x:1}; //p原型对象继承自Object.prototype
var o = Object.create(p); //o对象继承自p

console.log(p.isPrototypeOf(o));//true
console.log(Object.prototype.isPrototypeOf(o));//true
console.log(Object.prototype.isPrototypeOf(p));//true

Of course, the isPrototypeOf() method is very similar to the instanceof operator
The instanceof operator expects its left operand to be an object and its right operand to identify the class of the object. If the object on the left is an instance of the class on the right, the expression returns true, otherwise it returns false

var p = {x:1}; 
console.log(p instanceof Object);//true

var d = new Date();
console.log(d instanceof Date);//true
console.log(d instanceof Object);//true
console.log(d instanceof Number);//false

Expansion 2:

The class attribute of an object is a string that represents the type information of the object

Generally, after calling the toString() method, it returns a form of [object class]

For example

Copy code The code is as follows:

var obj = {x:1,y:2};
console.log(obj.toString());//[object Object]

So if you want to get the class of the object, you can find the "class" field in the returned string and use slice (8, -1)
For example

function classOf(obj){ // 找出类名
 if(obj === null){
  return "Null";
 }
 if(obj === undefined){
  return "Undefined";
 }
 return Object.prototype.toString.call(obj).slice(8,-1);
}

console.log(classOf(1)); //Number
//注意,实际上是这些类型的变量调用toString()方法,而不是通过他们自身直接调用
//console.log(1.toString()); //会报错
var a = 1;
console.log(Number(1).toString()); //1
console.log(a.toString()); //1
console.log({x:1}.toString()); //[object Object]

console.log(classOf(1)); //Number
console.log(classOf("")); //String
console.log(classOf("str")); //String
console.log(classOf(null)); //Null
console.log(classOf(false)); //Boolean
console.log(classOf({})); //Object
console.log(classOf([])); //Array
console.log(classOf(new Date())); //Date
function f(){}
console.log(classOf(new f())); //Object
Statement
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
JavaScript: Exploring the Versatility of a Web LanguageJavaScript: Exploring the Versatility of a Web LanguageApr 11, 2025 am 12:01 AM

JavaScript is the core language of modern web development and is widely used for its diversity and flexibility. 1) Front-end development: build dynamic web pages and single-page applications through DOM operations and modern frameworks (such as React, Vue.js, Angular). 2) Server-side development: Node.js uses a non-blocking I/O model to handle high concurrency and real-time applications. 3) Mobile and desktop application development: cross-platform development is realized through ReactNative and Electron to improve development efficiency.

The Evolution of JavaScript: Current Trends and Future ProspectsThe Evolution of JavaScript: Current Trends and Future ProspectsApr 10, 2025 am 09:33 AM

The latest trends in JavaScript include the rise of TypeScript, the popularity of modern frameworks and libraries, and the application of WebAssembly. Future prospects cover more powerful type systems, the development of server-side JavaScript, the expansion of artificial intelligence and machine learning, and the potential of IoT and edge computing.

Demystifying JavaScript: What It Does and Why It MattersDemystifying JavaScript: What It Does and Why It MattersApr 09, 2025 am 12:07 AM

JavaScript is the cornerstone of modern web development, and its main functions include event-driven programming, dynamic content generation and asynchronous programming. 1) Event-driven programming allows web pages to change dynamically according to user operations. 2) Dynamic content generation allows page content to be adjusted according to conditions. 3) Asynchronous programming ensures that the user interface is not blocked. JavaScript is widely used in web interaction, single-page application and server-side development, greatly improving the flexibility of user experience and cross-platform development.

Is Python or JavaScript better?Is Python or JavaScript better?Apr 06, 2025 am 12:14 AM

Python is more suitable for data science and machine learning, while JavaScript is more suitable for front-end and full-stack development. 1. Python is known for its concise syntax and rich library ecosystem, and is suitable for data analysis and web development. 2. JavaScript is the core of front-end development. Node.js supports server-side programming and is suitable for full-stack development.

How do I install JavaScript?How do I install JavaScript?Apr 05, 2025 am 12:16 AM

JavaScript does not require installation because it is already built into modern browsers. You just need a text editor and a browser to get started. 1) In the browser environment, run it by embedding the HTML file through tags. 2) In the Node.js environment, after downloading and installing Node.js, run the JavaScript file through the command line.

How to send notifications before a task starts in Quartz?How to send notifications before a task starts in Quartz?Apr 04, 2025 pm 09:24 PM

How to send task notifications in Quartz In advance When using the Quartz timer to schedule a task, the execution time of the task is set by the cron expression. Now...

In JavaScript, how to get parameters of a function on a prototype chain in a constructor?In JavaScript, how to get parameters of a function on a prototype chain in a constructor?Apr 04, 2025 pm 09:21 PM

How to obtain the parameters of functions on prototype chains in JavaScript In JavaScript programming, understanding and manipulating function parameters on prototype chains is a common and important task...

What is the reason for the failure of Vue.js dynamic style displacement in the WeChat mini program webview?What is the reason for the failure of Vue.js dynamic style displacement in the WeChat mini program webview?Apr 04, 2025 pm 09:18 PM

Analysis of the reason why the dynamic style displacement failure of using Vue.js in the WeChat applet web-view is using Vue.js...

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
3 weeks agoBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Best Graphic Settings
3 weeks agoBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. How to Fix Audio if You Can't Hear Anyone
3 weeks agoBy尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: How To Unlock Everything In MyRise
3 weeks agoBy尊渡假赌尊渡假赌尊渡假赌

Hot Tools

WebStorm Mac version

WebStorm Mac version

Useful JavaScript development tools

DVWA

DVWA

Damn Vulnerable Web App (DVWA) is a PHP/MySQL web application that is very vulnerable. Its main goals are to be an aid for security professionals to test their skills and tools in a legal environment, to help web developers better understand the process of securing web applications, and to help teachers/students teach/learn in a classroom environment Web application security. The goal of DVWA is to practice some of the most common web vulnerabilities through a simple and straightforward interface, with varying degrees of difficulty. Please note that this software

SublimeText3 Linux new version

SublimeText3 Linux new version

SublimeText3 Linux latest version

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser is a secure browser environment for taking online exams securely. This software turns any computer into a secure workstation. It controls access to any utility and prevents students from using unauthorized resources.

MantisBT

MantisBT

Mantis is an easy-to-deploy web-based defect tracking tool designed to aid in product defect tracking. It requires PHP, MySQL and a web server. Check out our demo and hosting services.