Get the App
SLTechnology News&Howtos  ›  Development  › 

What are the useful JavaScript techniques?

Shulou Source: shulou.com Published: 2022-06-03 16:52:18 09月16日 Update

This article will explain in detail what JavaScript skills are useful for you. The editor thinks it is very practical, so I share it for you as a reference. I hope you can get something after reading this article.

Array deduplication

Array deduplication may be easier than you think:

Var j = [. New Set ([1,2,3,4,4])] > > [1,2,3,4]

It's very simple. No!

Filter out the falsy value

Do you need to filter out the falsy values from the array (0 undefined, null, false, etc.)? You may not know that there is this technique:

Let res = [1, 2, 3, 4, 0, 0, 0, 3, 4, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2, 3, 4, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2, 3, 4, 4, respectively. Filter (Boolean); > 1, 2, 3, 4

Create an empty object

You can use {} to create an object that looks empty, but it still has _ _ proto__ and the usual hasOwnProperty and other object methods. However, there is one way to create a pure "dictionary" object:

Let dict = Object.create (null); / / dict.__proto__ = = "undefined" / / No object properties exist until you add them

The objects created in this way are pure, have no attributes or objects, and are very clean.

Merge object

The need to merge multiple objects in JavaScript already exists, especially when we start using options to create classes and widgets:

Const person = {name: 'David Walsh', gender:' Male'}; const tools = {computer: 'Mac', editor:' Atom'}; const attributes = {handsomeness: 'Extreme', hair:' Brown', eyes: 'Blue'}; const summary = {. Person,. Tools,. Attributes} / * Object {"computer": "Mac", "editor": "Atom", "eyes": "Blue", "gender": "Male", "hair": "Brown", "handsomeness": "Extreme", "name": "David Walsh",} * /

These three points (.) Make the task easier!

Parameters of Require function

Being able to set default values for function parameters is a great addition to JavaScript, but take a look at this tip, which requires passing values for a given parameter:

Const isRequired = () = > {throw new Error ('param is required');}; const hello = (name = isRequired ()) = > {console.log (`hello ${name} `)}; / / This will throw an error because no name is providedhello (); / / This will also throw an errorhello (undefined); / / These are goodwill hello (null); hello (' David')

Deconstruct and add aliases

Deconstruction is a popular addition to JavaScript, but sometimes we prefer to refer to these properties by other names, so we can use aliases:

Const obj = {x: 1}; / / Grabs obj.x as {x} const {x} = obj;// Grabs obj.x as {otherName} const {x: otherName} = obj

Helps avoid naming conflicts with existing variables!

Get query string parameters

Get the parameter value in url or append the query string, before that, we usually get the query string value through regular expressions, but now there is a new api, details can be seen here, we can deal with url in a very simple way.

For example, now that we have a url, "? post=1234&action=edit", we can use the following techniques to deal with this url.

/ / Assuming "? post=1234&action=edit" var urlParams = new URLSearchParams_ (window.location.search); console.log (urlParams.has ('post')); / / trueconsole.log (urlParams.get (' action')); / / "edit" console.log (urlParams.getAll ('action')); / / ["edit"] console.log (urlParams.toString ()); / / "? post=1234&action=edit" console.log (urlParams.append (' active','1')) / / "? post=1234&action=edit&active=1" about "what are the useful JavaScript skills"? this article ends here. I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, please share it for more people to see.

Tags: Objects techniques parameters characters strings arrays articles queries easy to use functions aliases properties methods more processing good practical clean three Apple Docker Huawei Linux macOS MariaDB Microsoft MySQL NVidia OPPO Reno macOS Huawei Docker Microsoft vpn