Heim  >  Artikel  >  Web-Frontend  >  2021 Hochfrequente und praktische JavaScript-Snippets

2021 Hochfrequente und praktische JavaScript-Snippets

coldplay.xixi
coldplay.xixinach vorne
2020-09-02 17:29:152084Durchsuche

🔜 . hat geholfen.

1. Ternärer Operator2021 Hochfrequente und praktische JavaScript-Snippets

let someThingTrue = true
if(someThingTrue){
    handleTrue()
}else{
    handleFalse()
}

****** 以下是简短版本 ******

let someThingTrue = true
someThingTrue ?  handleTrue() : handleFalse()复制代码
2. Kurzschluss- oder -Operation

const defaultValue = "SomeDefaultValue"
let someValueNotSureOfItsExistance = null
let expectingSomeValue = someValueNotSureOfItsExistance ||     defaultValue

console.log(expectingSomeValue) // SomeDefaultValue复制代码

3. Bedingung ist erfüllt

let someValue = true
if (someValue) {
  console.log('条件成立!')
}复制代码

4. for-Schleife
for (let i = 0; i < 1e2; i++) { // 代替 i<100 是不是有点酷
}复制代码
5. Object.entries()
let someValues = [1, 2, 4]
for (let val in someValues) {
  console.log(val)
}
let obj = {
  &#39;key1&#39;: &#39;value1&#39;,
  &#39;key2&#39;: &#39;value2&#39;,
  &#39;key3&#39;: &#39;value3&#39;
}
for (let key in obj) {
  console.log(key)
}复制代码
8 . Vorlagenliteral
let x=&#39;x&#39;,y=&#39;y&#39;
let obj = {x,y}

console.log(obj) // {x: "x", y: "y"}复制代码
10. Mehrzeilige Zeichenfolge

const credits = {
  producer: &#39;大迁世界&#39;,
  name: &#39;前端小智&#39;,
  rating: 9
}
const arr = Object.entries(credits)
console.log(arr)

*** 输出 ***
[ [ &#39;producer&#39;, &#39;大迁世界&#39; ], [ &#39;name&#39;, &#39;前端小智&#39; ], [ &#39;rating&#39;, 9 ] ]复制代码

12. Standardparameterwert

Frühe Übung

const credits = {
  producer: &#39;大迁世界&#39;,
  name: &#39;前端小智&#39;,
  rating: 9
}
const arr = Object.values(credits)
console.log(arr)

*** 输出 ***

[ &#39;大迁世界&#39;, &#39;前端小智&#39;, 9 ]复制代码

Späterer Ansatz 运算

let name = &#39;前端小智&#39;
let age = 20
var someStringConcatenateSomeVariable = `我是 ${name},今年 ${age} 岁`
console.log(someStringConcatenateSomeVariable)复制代码

3. 条件成立

import { observable, action, runInAction } from &#39;mobx&#39;;复制代码

4. for
let multiLineString = `some string\n
with multi-line of\n
characters\n`

console.log(multiLineString)复制代码

13. Die Abkürzung der Pfeilfunktion

const pets = [{
    type: &#39;Dog&#39;,
    name: &#39;Max&#39;
  },
  {
    type: &#39;Cat&#39;,
    name: &#39;Karl&#39;
  },
  {
    type: &#39;Dog&#39;,
    name: &#39;Tommy&#39;
  }
]
pet = pets.find(pet => pet.type === 'Dog' && pet.name === 'Tommy')

console.log(pet) // { type: 'Dog', name: 'Tommy' }复制代码

lautet wie folgt:

function area(h, w) {
  if (!h) {
    h = 1;
  }
  if (!w) {
    w = 1;
  }
  return h * w
}复制代码

14. Die Abkürzung der impliziten Rückgabe

function area(h = 1, w = 1) {
  return h * w
}复制代码

lautet wie folgt:

let sayHello = (name) => {
  return `你好,${name}`
}

console.log(sayHello('前端小智'))复制代码

15. Die Funktion muss Parameterwerte

let sayHello = name => `你好,${name}`

console.log(sayHello('前端小智'))复制代码

haben, die neu geschrieben werden sollen so:

let someFuncThatReturnSomeValue = (value) => {
  return value + value
}
console.log(
someFuncThatReturnSomeValue('前端小智'))复制代码

16.charAt() Abkürzung

let someFuncThatReturnSomeValue = (value) => (
  value + value
)
console.log(someFuncThatReturnSomeValue('前端小智'))复制代码

17. Bedingter Funktionsaufruf

function mustHavePatamMethod(param) {
  if (param === undefined) {
    throw new Error('Hey You must Put some param!');
  }
  return param;
}复制代码

Kurzschrift:

mustHaveCheck = () => {
  throw new Error('Missing parameter!')
}
methodShoudHaveParam = (param = mustHaveCheck()) => {
  return param
}复制代码
17.Math.Floor Abkürzung

'SampleString'.charAt(0) // S
// 简写
'SampleString'[0]复制代码
18.Math.pow Abkürzung

function fn1() {
  console.log('I am Function 1')
}

function fn2() {
  console.log('I am Function 2')
}
/*
长的写法
*/
let checkValue = 3;
if (checkValue === 3) {
  fn1()
} else {
  fn2()
}复制代码

19. Konvertieren Zeichenfolgen Für Zahlen

(checkValue === 3 ? fn1 : fn2)()复制代码
20.&& Operation

let val = '123.95'

console.log(Math.floor(val)) // 常规写法
console.log(~~val) // 简写复制代码

21.toString-Kurzschrift

Math.pow(2, 3) // 8
// 简写
2 ** 3 // 8复制代码
22. Optionaler Kettenoperator (in Kürze erhältlich

Das obige ist der detaillierte Inhalt von2021 Hochfrequente und praktische JavaScript-Snippets. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:juejin.im. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen