search
HomeWeb Front-endFront-end Q&AWhat are the characteristics of javascript objects

What are the characteristics of javascript objects

Dec 07, 2021 pm 03:58 PM
javascriptobjectFeatures

Characteristics of JavaScript objects: 1. The last attribute in the "key-value pair" list must end with a comma; 2. The data of an object declared using const can be modified; 3. The attribute name can It is the "[value]" method; 4. The left side of the "in" operator must be the attribute name, the right side is the object name, and the returned value is a Boolean value.

What are the characteristics of javascript objects

The operating environment of this tutorial: windows7 system, javascript version 1.8.5, Dell G3 computer.

Nine characteristics of js objects

First: The last attribute in the "key-value pair" list must end with a comma

This comma has a fancy name: trailing comma (trailing)

The reason should be for standardization, or simply for beauty.

Second: The data of an object declared using const can be modified

The properties inside the object can be modified.

It is not possible to change the entire object.

Third: Multi-word attribute names to mess with

The key in the key-value pair, that is, if the name in name: "zhangsan" becomes "new name ".

Changing the name from one word to multiple words will cause some things to change.

  • Points can no longer be used. It used to be person.name, but now we cannot write person.new name.
  • You should write person["new name"]

When you encounter a multi-word name, remember three points:

  • Use brackets

  • Name in quotes

  • You can write strings directly in the brackets, or you can write variables, because strings can also be written in variables

Fourth: There is a weird way to name attributes, square brackets[]

 let name="apple"
 var o={
     [name]:5,
 }
 alert(o.apple);

Remember, in square brackets What is stored is not a certain, rigid fixed value, but a variable. Do you understand variables?

The kind that is flexible and changeable.

Fifth: Under special circumstances, the attribute value can be abbreviated

function makeUser(name, age) {
  return {
    name: name,
    age: age,
    // ……其他的属性
  };
}

let user = makeUser("John", 30);
alert(user.name); // John

It can be obtained by observation that the attribute name and variable name are the same.

At this time, you can change the writing method:

Before the change: name: name

After the change: name

What is the meaning? It is just for convenience. In a sense, it also increases the burden on beginners. Therefore, everything has two sides and nothing is wrong.

Sixth: The attribute name can be chosen casually

No need to worry about keywords not being used (Why do you have to use keywords? It hurts to be idle)

Remember one thing: __proto__ attributes. We cannot set it to a non-object value

Seventh: The role of "in"

"key" in object
  • The attribute name is in in the object.

The left side of in must be the attribute name, the right side is the object name, and the returned value is Boolean true or false.

The attribute name is usually a string, but it may also be a variable, and the variable is still a string.

So strings are still working.

Why in?

Because I am afraid that undefined will cause trouble.

Eighth: for...in loop

Grammar format:

 for (key in object) {
   // 对此对象属性中的每个键执行的代码
 }

Among them, except for the key on the left of in which is uncertain (can be replaced by other words), the structures of the other words are certain.

The side reflects that the important thing in this statement is "which object is to be traversed".

Ninth: The order of object attributes

One concept: integer attribute name

The attribute name is an integer string

Another A concept: Integer string

can be converted into integer string

"1", "2", etc. are integer strings.

Remember:

  • When the attribute name is not an integer string, the order when traversing the object to output data is in the order of creation
  • When the attribute name is an integer character Strings, in order from smallest to largest.

[Related recommendations: javascript learning tutorial]

The above is the detailed content of What are the characteristics of javascript objects. For more information, please follow other related articles on the PHP Chinese website!

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
React's SEO-Friendly Nature: Improving Search Engine VisibilityReact's SEO-Friendly Nature: Improving Search Engine VisibilityApr 26, 2025 am 12:27 AM

Yes,ReactapplicationscanbeSEO-friendlywithproperstrategies.1)Useserver-siderendering(SSR)withtoolslikeNext.jstogeneratefullHTMLforindexing.2)Implementstaticsitegeneration(SSG)forcontent-heavysitestopre-renderpagesatbuildtime.3)Ensureuniquetitlesandme

React's Performance Bottlenecks: Identifying and Optimizing Slow ComponentsReact's Performance Bottlenecks: Identifying and Optimizing Slow ComponentsApr 26, 2025 am 12:25 AM

React performance bottlenecks are mainly caused by inefficient rendering, unnecessary re-rendering and calculation of component internal heavy weight. 1) Use ReactDevTools to locate slow components and apply React.memo optimization. 2) Optimize useEffect to ensure that it only runs when necessary. 3) Use useMemo and useCallback for memory processing. 4) Split the large component into small components. 5) For big data lists, use virtual scrolling technology to optimize rendering. Through these methods, the performance of React applications can be significantly improved.

Alternatives to React: Exploring Other JavaScript UI Libraries and FrameworksAlternatives to React: Exploring Other JavaScript UI Libraries and FrameworksApr 26, 2025 am 12:24 AM

Someone might look for alternatives to React because of performance issues, learning curves, or exploring different UI development methods. 1) Vue.js is praised for its ease of integration and mild learning curve, suitable for small and large applications. 2) Angular is developed by Google and is suitable for large applications, with a powerful type system and dependency injection. 3) Svelte provides excellent performance and simplicity by compiling it into efficient JavaScript at build time, but its ecosystem is still growing. When choosing alternatives, they should be determined based on project needs, team experience and project size.

Keys and React's Reconciliation Algorithm: Improving PerformanceKeys and React's Reconciliation Algorithm: Improving PerformanceApr 26, 2025 am 12:21 AM

KeysinReactarespecialattributesassignedtoelementsinarraysforstableidentity,crucialforthereconciliationalgorithmwhichupdatestheDOMefficiently.1)KeyshelpReacttrackchanges,additions,orremovalsinlists.2)Usingunique,stablekeyslikeIDsratherthanindicespreve

The Boilerplate Code Required for React Projects: Reducing Setup OverheadThe Boilerplate Code Required for React Projects: Reducing Setup OverheadApr 26, 2025 am 12:19 AM

ToreducesetupoverheadinReactprojects,usetoolslikeCreateReactApp(CRA),Next.js,Gatsby,orstarterkits,andmaintainamodularstructure.1)CRAsimplifiessetupwithasinglecommand.2)Next.jsandGatsbyoffermorefeaturesbutalearningcurve.3)Starterkitsprovidecomprehensi

Understanding useState(): A Comprehensive Guide to React State ManagementUnderstanding useState(): A Comprehensive Guide to React State ManagementApr 25, 2025 am 12:21 AM

useState()isaReacthookusedtomanagestateinfunctionalcomponents.1)Itinitializesandupdatesstate,2)shouldbecalledatthetoplevelofcomponents,3)canleadto'stalestate'ifnotusedcorrectly,and4)performancecanbeoptimizedusinguseCallbackandproperstateupdates.

What are the advantages of using React?What are the advantages of using React?Apr 25, 2025 am 12:16 AM

Reactispopularduetoitscomponent-basedarchitecture,VirtualDOM,richecosystem,anddeclarativenature.1)Component-basedarchitectureallowsforreusableUIpieces,improvingmodularityandmaintainability.2)TheVirtualDOMenhancesperformancebyefficientlyupdatingtheUI.

Debugging in React: Identifying and Resolving Common IssuesDebugging in React: Identifying and Resolving Common IssuesApr 25, 2025 am 12:09 AM

TodebugReactapplicationseffectively,usethesestrategies:1)AddresspropdrillingwithContextAPIorRedux.2)HandleasynchronousoperationswithuseStateanduseEffect,usingAbortControllertopreventraceconditions.3)OptimizeperformancewithuseMemoanduseCallbacktoavoid

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

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

This project is in the process of being migrated to osdn.net/projects/mingw, you can continue to follow us there. MinGW: A native Windows port of the GNU Compiler Collection (GCC), freely distributable import libraries and header files for building native Windows applications; includes extensions to the MSVC runtime to support C99 functionality. All MinGW software can run on 64-bit Windows platforms.

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

EditPlus Chinese cracked version

EditPlus Chinese cracked version

Small size, syntax highlighting, does not support code prompt function

mPDF

mPDF

mPDF is a PHP library that can generate PDF files from UTF-8 encoded HTML. The original author, Ian Back, wrote mPDF to output PDF files "on the fly" from his website and handle different languages. It is slower than original scripts like HTML2FPDF and produces larger files when using Unicode fonts, but supports CSS styles etc. and has a lot of enhancements. Supports almost all languages, including RTL (Arabic and Hebrew) and CJK (Chinese, Japanese and Korean). Supports nested block-level elements (such as P, DIV),

WebStorm Mac version

WebStorm Mac version

Useful JavaScript development tools