Relire les notes d'étude antérieures laissés derrière, a constaté un cari rappelez-vous juste le concept.
Et le contenu du livre est vraiment vieux, chaîne de lecture, donc beaucoup de Riga ci-dessous Ps.
------ Mise à jour Mars 2020
La première essence de chapitre
Javascript est construit sur quelques très bonnes idées et quelques très mauvaise idée,
D'excellentes idées d'objets littéraux incluent des fonctions, faiblement typés, les objets dynamiques et la représentation expressive.
Ces mauvaises idées comprennent un modèle de programmation basé sur les variables globales.
La deuxième grammaire chapitre
numérique:
javascript seulement un type numérique, est intérieurement représentée comme nombre à virgule flottante de 64 bits. Infinity représente toutes les valeurs supérieures à la 1.79769313486231570e + 308.
NaN représente une valeur produit pas un résultat normal, NaN ne correspond pas à une valeur quelconque, y compris elle-même. La fonction peut être utilisée isNaN ES5 (nombre) détecté NaN.
Ps. Pour ES 10, JS a été le deuxième numéro représentant le type, BigInt
déclaration:
La valeur est déterminée comme fausse par ce qui suit: false, null, non défini, chaîne vide « », le numéro 0, le nombre NaN.
Ps. Critères de conception ES fonctions décrites font directement référence ToBoolean
Le troisième chapitre objet
Javascript données simples types comprennent numérique, chaîne, booléen, valeur nulle et la valeur définie. Toutes les autres valeurs sont des objets.
Numbers, les chaînes, Boolean « ressemble à » des objets parce qu'ils ont les moyens, mais ils sont immuables.
Dans les tableaux sont des objets Javascript, les fonctions sont des objets, l'expression régulière est un objet, bien sûr, les objets naturels sont des objets.
Ps. Type ES6 Symbole Ajouté, ES10 ajouter un nouveau type de BigInt, si simples types de données Il existe sept types
Paramètres passés - passés par valeur et de transmission de référence
Objet passé par référence, ils ne seront jamais reproduit. Base de type passé par valeur
function add(num){
num+=10;
return num;
}
num=10;
alert(add(num));
aelrt(num);
//输出20,10 La sortie 20, 10 ici, l'explication officielle est que, lorsque les types de base JS de passage de paramètres, une copie réalisée opération num copie de trame de pile, de sorte que les déclarations de variables externes et les paramètres de la fonction num, ont exactement la même valeur , mais avec des adresses de paramètres complètement différents, qui ont tous deux ne savaient pas qui, lorsque l'appel de fonction retourne un paramètre de la fonction pop-up stack frame num.
Donc, changer les paramètres de la fonction num, sans impact sur les variables externes existantes.
function setName(obj){
obj.name="ted";
obj=new Object();
obj.name="marry";
}
var obj=new Object();
setName(obj);
alert(obj.name);
//输出ted adresse entrante de la fonction setName, de sorte que la deuxième ligne d'approche, la ligne 6 de obj affecté. Mais la première ligne de l'adresse obj 3 pratiques au sein de la fonction est modifiée au nouvel espace de pile, s'il vous plaît voir cet article
Ps. Votée par la valeur et passe quelque chose courante de référence Bale
Énumérer
utilisations d'objets pour la boucle de l'énumération, s'il est nécessaire de filtrer les valeurs non désirées. Les courants sont la plupart des filtres méthode hasOwnProperty ou d'exclure la fonction de typeof.
var stooge = {
'first-name': 'Jerome',
'last-name': 'Howard'
}
for (var name in stooge) {
if (typeof stooge[name] !== 'function') {
console.log(name + ': ' + stooge[name]);
}
}Tableau à l'aide d'une boucle, qui peut traverser dans le bon ordre, et ne vous inquiétez pas au sujet des attributs énumérés chaîne de prototype.
Énumération Ps. Personnellement, je préfère Object.keys (obj) .foreach (index => {}) de l'objet de la méthode do
Supprimer
opérateur delete peut être utilisé pour supprimer les propriétés de l'objet. Si l'objet contient la propriété, la propriété sera supprimée. Il ne touchera pas une chaîne de prototype d'objet.
Propriétés objets supprimés peuvent faire de la chaîne de prototype à travers stand
stooge.__proto__.nickname = 'Curly';
stooge.nickname = 'Moe';
stooge.nickname //'Moe'
delete stooge.nickname;
stooge.nickname //'Curly'Ps. Supprimer la prudence, à l' utiliser uniquement à des propriétés de suppression sur les objets, ne supprimez pas d' autres choses. Et stricte et le mode non-strict sera différent. Voir opérateur DMN-suppression
Chapitre IV Fonctions
appel
En appel Javascript Il y a 4 modes: le mode appel de méthode, le mode d'appel de fonction, le mode d'appel est configuré, Appliquer le mode d'appel. Ces appels sont différents modèles sur la façon d'initialiser les paramètres clés de cette.
Mode d'appel Méthode: Vous pouvez l'utiliser pour accéder à l'objet qu'ils appartiennent.
var myObject = {
value: 0,
increment: function(inc){
this.value += typeof inc === 'number' ? inc : 1;
}
};
myObject.increment();
console.log(myObject.value); // 1
myObject.increment(2);
console.log(myObject.value); // 3Mode d'appel de fonction: ce mode cela est lié à l'objet global.
var someFn = function () {
return this === window; //true
}Constructeur en mode appelle
Devant apporter une nouvelle fonction d'appel, puis crée secrètement une connexion au nouveau membre prototype d'objet de la fonction. En même temps, ce sera lié au nouvel objet.
var Quo = function (string) {
this.status = string;
}
Quo.prototype.get_status = function(){
return this.status;
}
var myQuo = new Quo('confused');
console.log(myQuo.get_status()); //'confused'appliquer le mode d'appel: Construisons un éventail de paramètres passés à la fonction d'appel qui nous permet de sélectionner la valeur de ce.
var statusObject = {
status: 'A-OK'
};
var status = Quo.prototype.get_status.apply(statusObject);(Appel, appliquer, bind distinction voir ici) [ http://blog.itpub.net/29592957/viewspace-1159067/ ]
var xw = {
name : "小王",
gender : "男",
age : 24,
say : function(school,grade) {
alert(this.name + " , " + this.gender + " ,今年" + this.age + " ,在" + school + "上" + grade);
}
}
var xh = {
name : "小红",
gender : "女",
age : 18
}
//对于call来说是这样的
xw.say.call(xh,"实验小学","六年级");
//而对于apply来说是这样的
xw.say.apply(xh,["实验小学","六年级郑州牛皮癣医院"]);
//看到区别了吗，call后面的参数与say方法中是一一对应的，而apply的第二个参数是一个数组，数组中的元素是和say方法中一一对应的，这就是两者最大的区别。
//那么bind怎么传参呢？它可以像call那样传参。
xw.say.bind(xh,"实验小学","六年级")();
//但是由于bind返回的仍然是一个函数，所以我们还可以在调用的时候再进行传参。
xw.say.bind(xh)("实验小学","六年级");Ps. 2020 ans, nous réagissons tellement de choses à écrire, lier la fonction comme connue à tout le monde peur
paramètres
Lorsque la fonction est appelée, vous obtiendrez une distribution gratuite paramètre est un tableau d'arguments. Erreur sur un langage de conception, les arguments ne sont pas un tableau vrai, il est juste un objet « semblable à un tableau » de. Bien qu'il possède une propriété de longueur, mais il n'y a aucun moyen tout du tableau. Pour utiliser un éventail de méthodes ont besoin d'utiliser les fonctions d'appel.
var sum = function () {
var i, sum = 0;
for (i = 0; i < arguments.length; i += 1) {
sum += arguments[i];
}
return sum;
};
sum(4, 8, 15, 16, 23, 42); //108retour
Une fonction retourne toujours une valeur. Si vous ne spécifiez pas de valeur de retour, elle renvoie undefined.
Si l'appel de fonction a précédé le nouveau préfixe, et la valeur de retour est un objet, ce (nouvel objet) est renvoyé
anormal
Si les moyens de traitement dépend du type d'exception, le gestionnaire d'exception doit vérifier le nom d'attribut de l'objet d'exception pour déterminer le type d'anomalie.
var add = function(a, b) {
if (typeof a !== 'number' || typeof b !== 'number') {
throw {
name: 'TypeError',
message: 'add needs numbers'
};
return a + b;
}
}
//构造一个try_it函数，以不正确的方式调用之前的add函数
var try_it = function(){
try{
add('seven');
} catch(e) {
console.log(e.name + ': ' + e.message);
}
}
try_it();portée
code javascript ne supporte pas la portée au niveau du bloc, seul champ de fonction. De nombreuses langues modernes sont des variables DECLARE délai recommandé que possible. Et utilisé javascript alors il deviendra mauvais conseils,
Parce qu'il n'a pas la portée de niveau bloc. La meilleure pratique consiste à déclarer toutes les variables en haut de la fonction du corps de la fonction qui pourrait être utilisé.
Ps. Cancer, mais ES6 a lancé vous racontons une variable, de sorte que le livre dit cette situation n'est pas un problème.
fermetures
La fermeture est la fonction des fonctions internes, référence peut être définie dans une variable qui agit sur l'extérieur de celui-ci. Bouclages que la création de leurs fonctions ont un cycle de vie plus longue, et la fermeture est une référence à ses variables externes de mémoire interne.
function box(){
var val = undefined;
return {
set: function(newVal) { val = newVal; },
get: function() { return val; },
type: function() { return typeof val; }
};
}
var b = box();
b.type(); //"undefined"
b.set(98.6);
b.get(); //98.6
b.type(); //"number"Comprendre la différence entre l'affectation et la liaison.
Fermeture par référence au lieu de la valeur capturée de leurs variables externes.
Utiliser l'expression de fonction (Ia vie) appelez immédiatement pour créer une portée locale.
Recherchez un programme BUG:
function wrapElements(a) {
var result = [];
for(var i = 0, n = a.length; i < n; i++) {
result[i] = function() { return a[i]; };
}
return result;
}
var wrapped = wrapElements([10, 20, 30, 40, 50]);
var f = wrapped[0];
f(); //undefinedCe code est trompeur, ce programmeur peut souhaiter programmer 10 sortie, mais la valeur de sortie est défini.
En effet , function() { return a[i]; };ce sac de rangement fermé i i est l'adresse des variables externes, chaque fois pendant le cycle se poursuit, une nouvelle fermeture, les valeurs i sont mises à jour. Donc , je reçois toujours la valeur de la valeur i après la fin de la boucle.
Mot correct devrait aller pour créer une fonction appelée immédiatement
function wrapElements(a) {
var result = [];
for(var i = 0, n = a.length; i < n; i++){
(function(j){
result[i] = function() {return a[j];};
})(i);
}
return result;
}Ps. La vieille routine, mais plutôt brusquement quand vous faites cycle d'écriture opération asynchrone ou périnée pour vous.
module
Utilisation du module de fonction et de la configuration de fermeture, il peut fournir un module d'interface est une fonction ou un objet est caché état. En modules, nous pouvons presque abandonner complètement l'utilisation des variables globales.
cascade
Si nous permettons à cette méthode renvoie plutôt que non définie, vous pouvez activer cascade (programmation de la chaîne)
getElement('myBoxDiv')
.move(350, 150)
.width(100)
.height(100)
.color('red');fonction curryfication
Est également une valeur de fonction, nous pouvons fonctionner de manière allé valeurs de la fonction, curryfication nous permet de fonctionner conjointement avec les paramètres qui lui sont passés, pour produire une nouvelle fonction.
Compatible avec les navigateurs modernes et méthode d'événement IE add du navigateur:
var addEvent = (function(){
if (window.addEventListener) {
return function(el, sType, fn, capture) {
el.addEventListener(sType, function(e) {
fn.call(el, e);
}, (capture));
};
} else if (window.attachEvent) {
return function(el, sType, fn, capture) {
el.attachEvent("on" + sType, function(e) {
fn.call(el, e);
});
};
}
})();Pour cela aurait seulement besoin de déterminer une fois et ne pas juger chaque appel addEvent Code de IE6 7 8. Ceci est typique de curryfication
Exécution d'une valeur initiale effectivement atteint addEvent partie d'application (une seule fois if ... else if ... détermination), alors que les autres paramètres sont appliqués pour atteindre les rendements de fonction, généralement taitement.
Ps. Lire tant de fois étrillé, bien que ce soit chose telle, mais toujours vite oublié son nom.
héritage Chapitre V
Les pseudo-classes
//定义一个构造器，并扩充它的原型
var Mammal = function (name) {
this.name = name;
};
Mammal.prototype.get_name = function(){
return this.name;
};
Mammal.prototype.says = function () {
return this.saying || '';
};
//构造伪类去继承Mammal，替换它的prototype为一个Mammal的实例来实现
var Cat = function(name) {
this.name = name;
this.saying = 'meow';
};
Cat.prototype = new Mammal();
//扩充新原型对象
Cat.prototype.get_name = function () {
return this.says() + ' ' + this.name + ' ' + this.says();
};
//创建实例
var myCat = new Cat('Henrietta');
myCat.says(); //'meow'
myCat.purr(5); //'r-r-r-r-r'
myCat.get_name(); //'meow Henrietta meow'De nombreux défauts pseudo-classes, comme l'absence d'environnement privé, toutes les propriétés sont publiques, ne peuvent pas accéder à la classe parente. Pour empirer les choses, créer une instance quand oublier d'ajouter nouveau préfixe, l'intérieur de ce constructeur sera lié à l'objet de la fenêtre, compromettant ainsi les variables d'environnement global.
Ps. ES6 écrire directement à la classe provinciale chose maintenant, mais il y a toujours la peur l'intervieweur demandera comment faire, et qui était une référence directe à mon autre ES5 hériteront la solution optimale
fonction de
Un modèle d'héritage de faiblesse n'est pas la vie privée, propriété de l'objet sont visibles, vous pouvez utiliser le mode de modules d'application pour résoudre.
var mammal = function (spec) {
var that = {};
that.get_name = function() {
return spec.name;
};
that.says = function() {
return spec.saying || '';
};
return that;
};
var myMammal = mammal({name: Herb});
var cat = function(spec){
spec.saying = spec.saying || 'meow';
var that = mammal(spec);
that.get_name = function(){
return that.says() + '' + spec.name + ' ' + that.says();
};
return that;
};
var myCat = cat({name: 'Henrietta'});
//定义一个处理父类的方法的方法
Function.prototype.method=function(name, func){
this.prototype[name]=func;
return this;
}
Object.method('superior', function(name){
var that = this,
method = that[name];
return function(){
return method.apply(that, arguments);
};
});
var coolcat = function(spec){
var that = cat(spec),
super_get_name = that.superior('get_name');
that.get_name = function(n){
//调用父类方法
return 'like ' + super_get_name() + ' baby';
};
return that;
};
var myCoolcat = coolcat({name: 'Bix'});
var name = myCoolCat.get_name(); // 'like meow Bix meow baby'le mode pseudo-classe par rapport à l'aide du modèle de fonction peut alors obtenir une meilleure encapsulation et dissimulation de l'information, et la possibilité d'accéder à la classe parente
Chapitre VI Tableau
lieu confondre
différence js pour les tableaux et les objets sont source de confusion. Tapez typeof rapport de l'opérateur du tableau est « objet » n'a pas de sens.
Nous pouvons compenser cette lacune en fonction personnalisée is_array
var is_array = function(value) {
return value &&
typeof value === 'object' &&
value.constructor === Array;
};Malheureusement, le nombre qui est configuré dans un réseau identifié à partir de différentes fenêtres (fenêtre) ou le cadre (Frame) échoue quand à l'intérieur. Il y a une meilleure façon de juger
var is_array = function (value) {
return Object.prototype.toString.call(value) === '[object Array]';
}Ps. Reportez-vous aussi d'identifier le type de Conduis-moi un autre
Chapitre VII Expressions régulières
facteur de Régularisation
De plus, à l'exception des caractères de contrôle suivants et des caractères spéciaux, tous les personnages sont littéralement traités
\ / [ ] ( ) { } ? + | . ^ $ -Si vous avez besoin énuméré ci - dessus pour correspondre au caractère littéralement, vous devez utiliser un \préfixe pour échapper à
En ne se sont échappés. Est-ce que correspond à tout caractère sauf \ n, autre que
caractère d'échappement regex
- \ F est le caractère d'alimentation, \ n saut de ligne, \ r est un retour chariot, \ t onglet
- \ D est équivalent à [0-9], qui correspond à un numéro. \ D En revanche, le nombre de non-appariement, [^ 0-9]
- \ S Correspond tous les caractères blancs, y compris les espaces, les onglets, les sauts de page, et ainsi de suite. Il est équivalent à [\ f \ n \ r \ t \ v]. contrairement \ S
- \ W correspond à tout caractère de mot, y compris underscore. Il est équivalent à la "[A-Za-z0-9_]". \ W contraste
- \ B correspond à une limite de mot, qui est, fait référence à l'emplacement et les espaces entre les mots. Par exemple, « er \ b » correspond à « jamais » dans le « er », mais ne correspond pas au « verbe » dans « er ».
Ps. Régulière s'il vous plaît se référer à problème
Chapitre VIII Méthodes
- Procédé réseau de ES5 ajouté
- objet méthode ES5 ajouté
- Pour plus de détails, voir les ES5
- Voir la ES3 de api du w3c
Ps. Trop de peine, et voyez maintenant directement MDN sortir
Annexe A, le cancer JS
- Les variables globales: code de programmation JS est basé sur une variable globale, la variable globale est le diable. programme à grande échelle sera très difficile de maintenir les variables globales et les variables globales implicites deviendra bug très difficile à trouver.
- Champ d'application: le code JS ne portée au niveau bloque pas seulement la portée de la fonction.
- null est pas un objet. Explication: Bien que typeof NULL objet de sortie, mais ce n'est que l'existence d'un bug à long JS. JS utilisé dans la version originale du système est de 32 bits, pour tenir compte du type d'informations à utiliser la variable de stockage de faible performance, toutefois, l'objet 000 est représentatif du début d'un ensemble de zéro ou nulle, l'erreur est déterminée à l'objet.
- Inséré automatiquement virgule: insertion automatique peut masquer une virgule erreur plus grave. L'erreur de programme suivant est inséré automatiquement dans un point-virgule, il renvoie undefined, sans aucun avertissement, la solution consiste à accolades d'écriture après la déclaration de retour
//错误实例
return
{
status: true;
};
//正确做法
return {
status: true;
};- mot réservé: ce mot est conservé dans un js octet de classe similaire, le nom ne peut pas être utilisé pour les variables ou les paramètres, et la plupart de ces mots et la langue ne soit plus utilisé.
- Problème de codage: js début de la conception, devrait 65536 caractères Unicode, le caractère js est 16 bits, assez pour couvrir le 65536 d' origine, est maintenant augmenter lentement aux caractères Unicode 100W.
Le million de caractères restants dont chacun peut être représenté par une paire de caractères. Une paire de caractères Unicode comme un seul caractère, et js pensent une paire de caractères sont deux personnages différents. - typeof: typeof opérateur ne permet pas d' identifier nul et des objets. typeof expression régulière sur l'identification du type, chaque mise en oeuvre du navigateur moins cohérente, IE / FF / retour de l' opéra 'objet', Safari 3.x Versions 'fonction' Retour, version 5.x de 'Object'
un opérateur typeof des tableaux et des objets impossibles à distinguer. - +: Chaîne de connexion, vous pouvez effectuer des additions, ce comportement complexe est une source commune du bogue. Si vous envisagez de faire une opération d'addition, assurez-vous que les deux opérateurs sont des entiers.
- Float: js 0,1 + 0,2 est pas égal à 0,3, mais le nombre entier en virgule flottante arithmétique est précis, il est donc mieux à même de décimales en arithmétique des nombres entiers, et ensuite converti en décimal.
- Pseudo-tableau: js pas de tableau réel, tableau js de vraiment utile, ne pas mettre en place la dimension transfrontalière et ne produira jamais une erreur, mais la performance et le tableau vrai que maman. opérateur typeof ne vérifie également les tableaux et les objets, respectivement. Nous avons besoin de l'aide d'autres fonctions
- valeur False: 0, NaN, '' (la chaîne vide), false, null, non défini. Il est faux de valeur logique js déterminée. Si vous utilisez == jugement, il est facile d'obtenir des résultats inattendus
Annexe B, JS crasses
- Et === ==: == forces opérateur opérandes conversion de type de données, l'étrange règle de conversion complexe, à utiliser pour déterminer le symbole de recommandations.
- avec l'énoncé: les résultats sont imprévisibles, mais aussi affecter considérablement le traitement js vitesse évités.
- eval: code forme eval plus difficile à lire, de sorte que le rendement a diminué de manière significative, parce qu'il a besoin pour exécuter le compilateur, outils de test pour tester la capacité de faire JSLint comme considérablement réduit, affaiblirait également la sécurité du programme.
constructeur Function est aussi une autre forme de eval, doit être évité. De même serTimeout setInterval et peut accepter un paramètre de chaîne et l'argument de la fonction, lorsque la chaîne de paramètres, tout comme eval
à processus, ce qui évite l'utilisation d'un argument de chaîne.
- continuer: instruction continue saute vers le haut du cycle. Mais la baisse des performances, être évitée.
- passer par: les conditions cas à travers à un autre cas, les conditions, qui est, par le commutateur. Ceci est une source commune d'erreur, et il est difficile de trouver des erreurs en regardant le code. Évitez d'utiliser des croix.
- Bit Opérateurs: js et il n'y a pas de type entier, l'utilisation au niveau du bit d'abord convertis en un nombre entier, puis à effectuer l'opération, de sorte que la vitesse d'exécution est très lente. js moins performant opérateur de bits, en utilisant l'opérateur bit bug rend plus facile caché.
- fonction de contraste de l'instruction de la fonction d'expression: la fonction est recommandé d'utiliser l'expression, car il a clairement indiqué que foo est une variable qui contient la valeur de fonction. Bonne compréhension de la langue, de comprendre la fonction de valeur est très importante.
var foo = function () {};fonction d'améliorer l'énoncé de la portée se produit lors de l'analyse, il ne va pas là-dedans si la déclaration de fonction
- Wrapper type d'objet: par exemple, new Boolean (false) renvoie un objet, type d'objet, provoque des problèmes lors de typeof de jugement de l'opérateur. Donc, évitez d'utiliser new Boolean, nouveau numéro, la nouvelle chaîne.
évitant également l'utilisation de nouveaux objets, new Array écrit, l'utilisation et la place {} [].
- nouvel opérateur: Si vous avez manqué le nouvel opérateur, le constructeur est appelé quand cela lié à l'objet global, avec des conséquences très graves.
vide: de nombreuses langues, vide est un type qui ne représente aucune valeur. Dans li js, vide est un opérateur qui prend un certain nombre d'opérations et le rendement indéfini. Ce n'est pas ce qui doit être évité. Forehead, dit-il, mais je voudrais encore utiliser vide 0 pour obtenir la valeur non définie.
Annexe E, JSON
objet JSON dans une autre conversion de format de chaîne, le code ci-dessous la
var str = JSON.stringify({what:'sss'}) //"{"what":"sss"}"
JSON.parse(str) // Object {what: "sss"}Un analyseur JSON, voir un autre article analyseur JSON