Maison  >  Article  >  interface Web  >  Points de connaissance de JavaScript qui sont facilement négligés

Points de connaissance de JavaScript qui sont facilement négligés

php中世界最好的语言
php中世界最好的语言original
2018-03-14 10:01:111516parcourir

Cette fois, je vais vous apporter des points de connaissances sur JavaScript qui sont facilement négligés. Quelles sont les précautions à propos de JavaScript qui sont facilement négligées. Voici des cas pratiques, jetons un coup d'œil.

1. Récupérer toutes les clés de l'objet :

var arr = ['a', 'b', 'c'];Object.keys(arr ); //["0","1","2"]var obj={name:Jack,age:12}Object.keys(obj)//["name","age"]Object.getOwnPropertyNames(obj)

2. Les attributs et méthodes de la fonction

nom. attribut : retour suivi du nom de la fonction après le mot-clé de fonction.

function f1() {}
f1.name // 'f1'var f2 = function () {};
f2.name // ''var f3 = function myName() {};
f3.name // 'myName'

attribut length : renvoie le nombre de paramètres qui devraient être transmis à la fonction, c'est-à-dire le nombre de paramètres dans la définition de la fonction. La méthode toString de la fonction

function f(a, b) {}
f.length // 2

renvoie le code source de la fonction.

function f() {
  a();
  b();
  c();
}
f.toString()// function f() {//  a();//  b();//  c();// }

3. Habituellement, l'occasion la plus courante d'évaluation est d'analyser les chaînes de données JSON, mais l'approche correcte devrait être d'utiliser la méthode JSON.parse fournie par le navigateur

4. . L'Opérateur au niveau du bit est utilisé pour calculer directement les bits binaires, il y en a 7 au total.

Ou opération (ou) : Le symbole est |, ce qui signifie que si les deux bits binaires sont 0, le résultat est 0, sinon il est 1.

Et opération (et) : Le symbole est &, ce qui signifie que si les deux bits binaires sont 1, le résultat est 1, sinon il est 0.

Aucune opération (pas) : Le symbole est ~, ce qui signifie inverser un bit binaire.

Opération OU exclusif (xor) : Le symbole est ^, ce qui signifie que si les deux bits binaires ne sont pas identiques, le résultat est 1, sinon il est 0.

Opération de décalage vers la gauche (décalage vers la gauche) : le symbole est 0cc5ee9701c6b4f72b6c15d0ac501427>.
L'opérateur de décalage à droite signifie déplacer la valeur binaire d'un nombre vers la droite du nombre de chiffres spécifié, en complétant la tête avec 0, c'est-à-dire en divisant par la puissance spécifiée de 2 (le bit le plus élevé, le bit de signe , ne participe pas au mouvement). > ,

// est décimal 2

*/-4 >> 1// -2/*
// Parce que la forme binaire de -4 est 111111111111111111111111111100,
// Shift un bit vers la droite, ajoutez 1 à la tête et obtenez 11111111111111111111111111111110,
// est la décimale -2
*/


opération de décalage à droite avec bit de signe (zéro rempli à droite shift) : le signe est >>>
Cet opérateur consiste à déplacer la forme binaire d'un nombre vers la droite, y compris le bit de signe, et à ajouter 0 à la tête. Cette opération renvoie donc toujours une valeur positive. Pour les nombres positifs, le résultat de cette opération est exactement le même que l'opérateur de décalage vers la droite (»). La principale différence est que les nombres négatifs

4 >>> >> 1/ / 2147483646/*

// Parce que la forme binaire de -4 est 11111111111111111111111111100,
// Décalez le bit de signe vers la droite d'un bit et obtenez 0111111111111111111111111111. 0,

// C'est 2147483646 en décimal.

*/


5. Le type d'erreur natif de JavaScript

SyntaxError est une erreur de syntaxe qui se produit lors de l'analyse du code.

ReferenceError est une erreur qui se produit lors du référencement d'une variable qui n'existe pas.

// 变量名错误var 1a;// 缺少括号console.log 'hello');
RangeError est une erreur qui se produit lorsqu'une valeur dépasse la plage valide. Il existe plusieurs situations principales, l'une est que la longueur du tableau est un nombre négatif, l'autre est que les paramètres de méthode de l'objet Number sont hors plage et que la pile de fonctions dépasse la valeur maximale.

new Array(-1)// RangeError : longueur de tableau non valide (1234).toExponential(21)// RangeError : l'argument toExponential() doit être compris entre 0 et 20
unknownVariable// ReferenceError: unknownVariable is not definedconsole.log() = 1// ReferenceError: Invalid left-hand side in assignmentthis = 1// ReferenceError: Invalid left-hand side in assignment

TypeError est une erreur qui se produit lorsqu'une variable ou un paramètre n'est pas du type attendu. Par exemple, si vous utilisez la nouvelle commande sur des types primitifs tels que des chaînes, des valeurs booléennes et des valeurs numériques, cette erreur sera générée car le paramètre de la nouvelle commande doit être un constructeur.


URIError est une erreur générée lorsque le paramètre

de la fonction

liée à l'URI est incorrect, impliquant principalement encodeURI(), decodeURI(), encodeURIComponent(), decodeURIComponent(), escape() et unescape().
new 123//TypeError: number is not a funcvar obj = {};
obj.unknownMethod()// TypeError: obj.unknownMethod is not a function

Lorsque la fonction eval n'est pas exécutée correctement, une EvalError sera levée. Ce type d'erreur n'apparaît plus dans ES5 et n'est conservé que pour garantir la compatibilité avec le code précédent.

6. Erreurs personnalisées
decodeURI('%2')// URIError: URI malformed

Le code ci-dessus personnalise un objet d'erreur UserError et lui permet d'hériter de l'objet Error. Ensuite, vous pouvez générer cette erreur personnalisée.

new UserError("Ceci est une erreur personnalisée!");
function UserError(message) {   this.message = message || "默认信息";   this.name = "UserError";
}
UserError.prototype = new Error();
UserError.prototype.constructor = UserError;

7. Style de programmation JavaScript

Indentation

Choisissez l'indentation de la touche espace ou tabulation, vous ne pouvez que choisissez un type et ne les mélangez pas. Si vous ajoutez un projet à mi-chemin, suivez le style du programme d'origine.

Bloc

Les accolades au début du bloc, ne commencent pas une nouvelle ligne, mais doivent suivre le bloc, comme suit :

Parenthèses

Indique que lorsque la fonction est appelée, il n'y a pas d'espace entre le nom de la fonction et le crochet gauche.
block{
    ···
}

indique que lors de la définition d'une fonction, il n'y a pas d'espace entre le nom de la fonction et le crochet gauche.

其他情况时,前面位置的语法元素与左括号之间,都有一个空格。

行尾的分号
建议不要省略

全局变量
JavaScript最大的语法缺点,可能就是全局变量对于任何一个代码块,都是可读可写。这对代码的模块化和重复使用,非常不利。
因此,避免使用全局变量。如果不得不使用,用大写字母表示变量名,比如UPPER_CASE。

变量声明
JavaScript会自动将变量声明”提升”(hoist)到代码块(block)的头部。

if (!o) {  var o = {};
}// 等同于var o;if (!o) {
  o = {};
}

为了避免可能出现的问题,最好把变量声明都放在代码块的头部。

for (var i = 0; i < 10; i++) {  // ...}// 写成var i;for (i = 0; i < 10; i++) {  // ...}

另外,所有函数都应该在使用之前定义,函数内部的变量声明,都应该放在函数的头部。

new命令
JavaScript使用new命令,从构造函数生成一个新对象。

var o = new myObject();

上面这种做法的问题是,一旦你忘了加上new,myObject()内部的this关键字就会指向全局对象,导致所有绑定在this上面的变量,都变成全局变量。
因此,建议使用Object.create()命令,替代new命令。如果不得不使用new,为了防止出错,最好在视觉上把构造函数与其他函数区分开来。比如,构造函数的函数名,采用首字母大写(InitialCap),其他函数名一律首字母小写。

with语句
禁止使用with语句。

相等和严格相等
不要使用“相等”(==)运算符,只使用“严格相等”(===)运算符。

语句的合并
有些程序员追求简洁,喜欢合并不同目的的语句。比如,原来的语句是

a = b;if (a) {  // ...}```

他喜欢写成下面这样。

if (a = b) {
// ...
}

虽然语句少了一行,但是可读性大打折扣,而且会造成误读,让别人误解这行代码的意思是下面这样。

```if (a === b){  // ...}```

建议不要将不同目的的语句,合并成一行。
- 自增和自减运算符
自增(++)和自减(--)运算符,放在变量的前面或后面,返回的值不一样,很容易发生错误。事实上,所有的++运算符都可以用+= 1代替。

- switch…case结构switch...case结构要求,在每一个case的最后一行必须是break语句,否则会接着运行下一个case。这样不仅容易忘记,还会造成代码的冗长。
而且,switch...case不使用大括号,不利于代码形式的统一。此外,这种结构类似于goto语句,容易造成程序流程的混乱,使得代码结构混乱不堪,不符合面向对象编程的原则。

function doAction(action) {
switch (action) {
case &#39;hack&#39;:
return &#39;hack&#39;;
break;
case &#39;slash&#39;:
return &#39;slash&#39;;
break;
case &#39;run&#39;:
return &#39;run&#39;;
break;
default:
throw new Error(&#39;Invalid action.&#39;);
}
}

上面的代码建议改写成对象结构。

function doAction(action) {
var actions = {
&#39;hack&#39;: function () {
return &#39;hack&#39;;
},
&#39;slash&#39;: function () {
return &#39;slash&#39;;
},
&#39;run&#39;: function () {
return &#39;run&#39;;
}
};
if (typeof actions[action] !== &#39;function&#39;) {
throw new Error(&#39;Invalid action.&#39;);
}
return actionsaction;
}```

建议避免使用switch...case结构,用对象结构代替。

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

Javascript的策略模式

用JS实现排序算法

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