Rendez votre codage JavaScript plus standardisé

Dans le travail réel, nous devrions souvent voir du code qui n'a aucun problème de fonctionnement, mais qui a un style de codage et des spécifications très médiocres, ce qui fait souvent que les gens n'osent plus lire, et affecte même le sentiment du lecteur. Le but de cet article est d'aider les apprenants JavaScript qui n'ont pas développé un bon style de codage et qui ne connaissent pas les normes de codage correspondantes à améliorer leur image de codage.

Avant-propos

Dans le travail réel, nous devrions souvent voir du code qui n'a aucun problème de fonctionnement mais un style de codage et des spécifications très médiocres. peur de continuer à lire et peut même affecter l'humeur du lecteur pour la journée. Ces codes sont non seulement difficiles à lire, mais aussi difficiles à maintenir. Ils sont généralement écrits par des novices qui viennent de commencer la programmation, ou par des programmeurs expérimentés qui travaillent depuis plusieurs années. Par conséquent, le but de cet article est d'aider les apprenants JavaScript qui n'ont pas développé un bon style de codage et qui ne connaissent pas les normes de codage correspondantes à améliorer leur image de codage.

Coding Image

J'ai proposé le concept de codage d'image ci-dessus, je pense personnellement :

Coding Image = Coding Style. + Normes de codage

Une bonne image de codage équivaut à un jeune homme bien habillé. Pour les programmeurs, c'est le moyen le plus direct et le plus simple pour les pairs de comprendre vos excellentes capacités.

Jetons un coup d'œil à une mauvaise image de codage :

//打个招呼
function func(){
 var age=18,sex='man';
 var greeting='hello';
 if(age<=18&&sex==&#39;man&#39;){
 console.log(greeting+&#39;little boy&#39;)
 }
 ...
}
func()

Le code ci-dessus est entièrement réduit, manque de connaissance des normes et l'expérience de lecture est très mauvaise à supporter. pour le regarder.

Regardons une bonne image de code :

// 打个招呼
function greetFn() {
 var age = 18,
 sex = 'man',
 greeting = 'hello';
 if (age <= 18 && sex === &#39;man&#39;) {
 console.log(greeting + &#39;little boy&#39;);
 }
 ...
};
greetFn();

Le code ci-dessus est-il plus confortable ?

On peut voir que développer une bonne image de codage est crucial, et cet article explique principalement l'image de codage basée sur JavaScript, c'est-à-dire le style de codage et les spécifications de codage basés sur JavaScript.

Alors, qu'est-ce que le style de codage, qu'est-ce que la spécification de codage et quelle est la différence entre les deux ?

Style de codage

Tout d'abord, puisque le style de codage est un style, il n'y a pas de bien ou de mal. Tout comme tout le monde s’habille différemment, certaines personnes s’habillent de manière plus appropriée et d’autres de manière plus décontractée.

Dans le style de codage JavaScript, il existe également un style relativement décent. Surtout dans le développement d'équipe, nous ne pouvons pas écrire notre propre style à volonté.

Voici quelques styles de codage occasionnels et comparez-les avec de bons styles de codage.

1. RaisonnablesNotes

// 不推荐的写法
var name = '劳卜';//代码和注释之间没有间隔

if (name) {
 /*
 *注释之前无空行
 *星号后面无空格
 */
}

// 推荐的写法
var name = '劳卜'; // 代码和注释之间有间隔

if (name) {
 /*
 * 注释之前有空行
 * 星号后面有空格
 */
}

2.

// 不推荐的写法
var name='劳卜'; // 等号和两侧之间没有间隔

// if块级语句间没有间隔
if(name){
 console.log('hello');
}

// 推荐的写法
var name = '劳卜'; // 等号和两侧之间有间隔

// if块级语句间有间隔
if (name) {
 console.log('hello');
}

3. Indentation raisonnable

// 不推荐的写法：没有合理缩进
function getName() {
console.log('劳卜'); 
}

// 推荐的写法：合理缩进
function getName() {
 console.log('劳卜');
}

4. Lignes vierges raisonnables

// 不推荐的写法: 代码功能块之间没有空行
function getName() {
 var name = '劳卜';
 if (name) {
 console.log('hello');
 }
}

// 推荐的写法：代码功能块之间有空行
function getName() {
 var name = '劳卜';

 if (name) {
 console.log('hello');
 }
}

5.

6. Déclaration raisonnable

// 不推荐的写法
var getName = '劳卜'; // 变量命名前缀为动词

// 函数命名前缀为名词
function name() {
 console.log('hello');
}

// 推荐的写法
var name = '劳卜'; // 变量命名前缀为名词

// 函数命名前缀为动词
function getName() {
 console.log('hello');
}

7.

// 不推荐的写法：函数在声明之前使用
getName(); 

function getName() {
 console.log('hello');
}

// 推荐的写法：函数在声明之后使用
function getName() {
 console.log('hello');
}

getName();

Ce qui précède répertorie principalement 7 exemples de styles de codage courants à des fins de comparaison. Il n'y a pas de bon ou de mauvais dans la méthode d'écriture recommandée et la méthode d'écriture non recommandée, c'est juste la méthode d'écriture recommandée en comparaison. , il est plus facile à lire et à maintenir, plus adapté au développement d'équipe et constitue également l'incarnation d'une bonne image de codage. Spécifications de codage

// 不推荐的写法：没有使用分号结尾
var name = '劳卜' 

var getName = function() {
 console.log('hello')
}

Pour les spécifications de codage, puisqu'il s'agit de spécifications, nous devons les rédiger selon certaines règles. L'écriture aléatoire de code qui viole les normes de codage peut entraîner des erreurs de programme et des bogues potentiels. Il doit donc être plus rigoureux que le style de codage, et certaines personnes incluront le style de codage dans les normes de codage.

// 推荐的写法：使用分号结尾
var name = '劳卜'; 

var getName = function() {
 console.log('hello');
};

Voici quelques exemples de codes courants :

1. Comparez les paramètres

2. Enveloppez la déclaration if

// 不推荐的写法：==和!=比较时会进行类型转换，应尽量避免使用
var num = 123;

if (num == '123') {
 console.log(num);
} else if (num != '321') {
 console.log('321');
}

// 推荐的写法：使用===和!==来进行比较
var num = 123;

if (num === '123') {
 console.log(num);
} else if (num !== '321') {
 console.log('321');
}

3. Utilisez eval avec prudence

// 不推荐的写法：if语句不用大话号包裹会出现潜在bug
var num = 123;
if (num === '123')
 console.log(num);

// 推荐的写法：if语句用大话号包裹
var num = 123;
if (num === '123') {
 console.log(num);
}

4. Déterminez le type

// 不推荐的写法：应避免使用eval，不安全，非常耗性能（一次解析成js语句，一次执行）
var json = '{"name": "劳卜", "func": alert("hello")}';
eval('(' + json + ')'); // 弹出“hello”

// 推荐的写法
var json = '{"name": "劳卜", "func": alert("hello")}';
JSON.parse(json); // 校验报错

5.

// 不推荐的写法：用typeof来判断构造函数创建的对象
var str = new String('劳卜'); 
console.log(typeof str); // 'object'

// 推荐的写法：用instanceof来判断构造函数创建的对象
var str = new String('劳卜'); 
console.log(str instanceof String); // true

Ce qui précède répertorie principalement 5 exemples de normes de codage courantes. Normaliser raisonnablement votre propre code peut réduire considérablement les coûts de maintenance inutiles et les risques de bogues potentiels. Les apprenants JavaScript doivent garder à l’esprit.

Conclusion"Les programmes sont écrits pour que les humains puissent les lire, et ils ne sont qu'occasionnellement exécutés par des ordinateurs. Nous ne pouvons pas détruire notre propre code juste pour le plaisir." commodité, ce qui peut causer des problèmes inutiles aux autres et à l'ensemble du projet.

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!