2021 Extraits JavaScript haute fréquence et pratiques

[Recommandations d'apprentissage associées : tutoriel vidéo javascript]

Sans plus tarder, dans cet article, je liste quelques extraits de code JavaScript couramment utilisés ou pratiques. J'espère que cela vous sera utile.

1. Opérateur ternaire

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

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

let someThingTrue = true
someThingTrue ?  handleTrue() : handleFalse()复制代码

2. Fonctionnement en court-circuit 或

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

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

3. La condition est vraie

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

4. Boucle

for (let i = 0; i < 1e2; i++) { // 代替 i<100 是不是有点酷
}复制代码

let someValues = [1, 2, 4]
for (let val in someValues) {
  console.log(val)
}
let obj = {
  'key1': 'value1',
  'key2': 'value2',
  'key3': 'value3'
}
for (let key in obj) {
  console.log(key)
}复制代码

for5. Mappage des valeurs vers les objets

let x='x',y='y'
let obj = {x,y}

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

6. Object.entries()

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

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

7. 🎜>8 . Littéral de modèle

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

*** 输出 ***

[ '大迁世界', '前端小智', 9 ]复制代码

9. Affectation de déstructuration

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

10. Chaîne multiligne

import { observable, action, runInAction } from 'mobx';复制代码

11. 12. Valeur du paramètre par défaut

Approche précoce

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

console.log(multiLineString)复制代码

Approche ultérieure ES6

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

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

13. L'abréviation de la fonction flèche

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

est abrégée comme suit :

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

14. Le retour implicite

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

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

est abrégé comme suit :

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

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

15. La fonction doit avoir la valeur de paramètre

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

pour être réécrite comme ceci. :

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

16.charAt() abréviation

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

17.Appel de fonction conditionnelle

mustHaveCheck = () => {
  throw new Error('Missing parameter!')
}
methodShoudHaveParam = (param = mustHaveCheck()) => {
  return param
}复制代码

Manière d'écriture courte :

'SampleString'.charAt(0) // S
// 简写
'SampleString'[0]复制代码

17.Math.Floor abréviation

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()
}复制代码

18.Math.pow abréviation

(checkValue === 3 ? fn1 : fn2)()复制代码

19. Convertir la chaîne en nombre

let val = '123.95'

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

20.&& opération

Math.pow(2, 3) // 8
// 简写
2 ** 3 // 8复制代码

21.toString abréviation

const num1 = parseInt('100')
// 简写
console.log(+"100")
console.log(+"100.2")复制代码

22. Opérateur de chaîne en option (à venir

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!