Maison  >  Article  >  interface Web  >  Compétences que vous devez maîtriser en JavaScript

Compétences que vous devez maîtriser en JavaScript

零下一度
零下一度original
2017-07-19 17:42:271046parcourir

Si vous débutez avec JavaScript ou si vous ne l'avez rencontré que récemment dans votre travail de développement, vous pourriez vous sentir frustré. Tous les langages ont leurs particularités - mais les développeurs qui passent d'un langage côté serveur basé sur un typage fort peuvent être confus. J'étais comme ça, il y a quelques années, lorsque j'ai été poussé à devenir développeur JavaScript à plein temps, et il y avait beaucoup de choses que j'aurais aimé savoir au début. Dans cet article, je vais partager certaines de mes bizarreries et j'espère pouvoir partager avec vous certaines des expériences qui m'ont donné beaucoup de maux de tête. Ceci n’est pas une liste complète – juste une liste partielle – mais j’espère qu’elle vous ouvrira les yeux sur la puissance de ce langage et sur des choses que vous avez peut-être autrefois considérées comme un obstacle.

1. Vérification nulle (nulle, non définie)

Lorsque nous créons une nouvelle variable, nous vérifions généralement si la valeur de la variable est nulle (nulle) ou autrement indéfinie. Il s'agit d'une vérification qui doit souvent être prise en compte pour la programmation JavaScript.

Si vous l'écrivez directement, alors cela ressemble à ceci :

tbody>Nous pouvons utiliser une version plus concise :

if (variable1 !== null || variable1 !== non défini || variable1 !== '') { let variable2 = variable1; }
if (variable1 !== null || variable1 !== undefined || variable1 !== '') { let variable2 = variable1; }

let variable2 = variable1  || '';

let variable2 = variable1 || '';
//值为null的例子
let variable1 = null;
let variable2 = variable1  || '';
console.log(variable2);
//输出: ''
//值为undefined的例子
let variable1 = undefined;
let variable2 = variable1  || '';
console.log(variable2);
//输出: ''
//正常情况
let variable1 = 'hi there';
let variable2 = variable1  || '';
console.log(variable2);
//输出: 'hi there'

Si vous n'y croyez pas, essayez-le dans la console du panel de développeurs Google Chrome !

tbody>
//Exemple de valeur nulle

let variable1 = null;
let variable2 = variable1 || '';
let a = new Array(); a[0] = "myString1"; a[1] = "myString2"; a[2] = "myString3";

console.log(variable2);
//Sortie : ''

//Exemple de valeur non définie
let variable1 = undefined;
let a = ["myString1", "myString2", "myString3"];

let variable2 = variable1 || '';

console.log(variable2);
//Sortie : ''
let big;
if (x > 10) {
big = true;
}
else {
big = false;
}
//Situation normale

let variable1 = 'salut';
let big = x > 10 ? true : false;
laissez variable2 = variable1 || '';
console.log(variable2 );
//Sortie : 'salut'
2. TableauCela semble relativement simple ! Code non optimisé :
let a = new Array(); a[0] = "myString1"; 1] = "myString2"; a[2] = "myString3";
Optimiser le code :
laisser un = ["myString1", "myString2", "myString3"];
3. Optimisation de if true .. else Simplifié :
laissez grand ;
if (x > 10) {
big = true ;
}
else {
big = false;
}
let big = x > 10 ? true : false;

Simplifie grandement la quantité de code !

let big = (x > 10);
let x = 3,
big = (x > 10) ? "greater 10" : (x < 5) ? "less 5" : "between 5 and 10";
console.log(big); //"less 5"
let x = 20,
big = {true: x>10, false : x< =10};
console.log(big); //"Object {true=true, false=false}"

4. Déclaration des variables

Bien que JavaScript hisse automatiquement les variables, cette méthode peut être utilisée pour déclarer toutes les variables sur une seule ligne en tête de la fonction.

Avant optimisation :

let x;
let y;
let z = 3;

Après optimisation :

let x, y, z=3;

Simplification des relevés d'affectation

Avant simplification :

x=x+1;
minusCount = minusCount - 1;
y=y*10;

Après simplification :

x++;
minusCount --;
y*=10;

Supposons x=10, y=5, puis Les opérations arithmétiques de base peuvent utiliser les abréviations suivantes :

x += y // x=15
x -= y // x=5
x *= y // x=50
x /= y // x=2
x %= y // x=0

6. Évitez d'utiliser des RegExp objets

avant la simplification :

var re = new RegExp("d+(.)+d+","igm"),
result = re.exec("padding 01234 text text 56789 padding");
console.log(result); //"01234 text text 56789"

Simplifié :

var result = /d+(.)+d+/igm.exec("padding 01234 text text 56789 padding");
console.log(result); //"01234 text text 56789"

7. En cas d'optimisation des conditions

Bien que ce soit très simple, cela mérite quand même d'être mentionné.

Avant simplification :

if (likeJavaScript === true)

Après simplification :

if (likeJavaScript)

Faisons une autre phrase pour juger si elle est vrai ou pas Exemple :

let c;
if ( c!= true ) {
// do something...
}

Simplifié :

let c;
if ( !c ) {
// do something...
}

9. Optimisation des paramètres de fonction

J'ai personnellement tendance à utiliser la méthode d'obtention d'éléments d'objet pour accéder Paramètres de fonction, bien sûr, c'est une question d'opinion !

Version habituellement utilisée :

function myFunction( myString, myNumber, myObject, myArray, myBoolean ) {
// do something...
}
myFunction( "String", 1, [], {}, true );

Ma version préférée :

function myFunction() {
/* 注释部分
console.log( arguments.length ); // 返回 5
for ( i = 0; i < arguments.length; i++ ) {
console.log( typeof arguments[i] ); // 返回 string, number, object, object, boolean
}
*/
}
myFunction( "String", 1, [], {}, true );

Note du traducteur : il y a des commentaires sous l'article original indiquant qu'il n'est pas recommandé d'utiliser la méthode de l'affiche originale. L'ordre des paramètres de fonction peut être modifié en utilisant la première méthode, mais vous devez être prudent avec la seconde méthode.

10. Alternatives à charAt()

Avant simplification :

"myString".charAt(0);

Après simplification :

"myString"[0]; // 返回 'm'

Note du traducteur : je crois qu'il n'y a plus beaucoup de gens qui utilisent la première méthode !

11. Les appels de fonction peuvent être plus courts

Avant simplification :

function x() {console.log('x')};function y() {console.log('y')};
let z = 3;
if (z == 3)
{
x();
} else
{
y();
}

Après simplification :

function x() {console.log('x')};function y() {console.log('y')};let z = 3;
(z==3?x:y)();


Vous avez dit que Si Bu Si était petit ?

12. Comment exprimer les grands nombres avec élégance

En JavaScript, il existe un moyen d'abréger les nombres, peut-être que vous l'avez ignoré. 1e7 signifie 1 000 000.

Avant simplification :

for (let i = 0; i < 10000; i++) {


Après simplification :

for (let i = 0; i < 1e7; i++) {

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn