Part1 Code manuscrit
Le code manuscrit sur site est un type de questions d'entrevue très courant dans les entretiens, examinant les structures de données de base et les capacités d'algorithme.
1. Implémentation de la déduplication du tableau
Déduplication de base
Array.prototype.Unique = fonction () {var result = []; this.ForEach (function (v) {if (result.indexof (v) <0) {result.push (v);}}); Retour Résultat;}• Utilisez la table de hachage pour déduir, c'est un moyen d'échanger un espace contre le temps
Array.prototype.Unique = function () {var result = [], hash = {}; this.ForEach (function (v) {if (! hash [v]) {hash [v] = true; result.push (v);}}); Retour Résultat;}Il y a un bug dans la méthode ci-dessus. Pour les tableaux [1,2, «1», «2», 3], le résultat de déduplication est [1,2,3]. La raison en est que l'objet lancera l'index d'attribut lorsque l'objet index. Arr ['1'] et arr [1] obtiennent tous deux les valeurs de Arr [1], donc certaines modifications doivent être apportées:
Array.prototype.Unique = function () {var result = [], hash = {}; this.ForEach (function (v) {var type = typeof (v); // get element type hash [v] || (hash [v] = new Array ()); if (hash [v] .indexof (type) <0) {hash [v] .push (type); // type de stockage. Retour Résultat;}• Triez d'abord puis supprimez la répétition
Array.prototype.Unique = function () {var result = [this [0]]; this.sort (); this.ForEach (fonction (v) {v! = result [result.length - 1] && result.push (v); // comparer uniquement avec le dernier élément du résultat});}2 Implémentation de tri rapide
Méthode 1 (n'utilisez pas autant que possible la méthode du tableau JS):
fonction QuickSort (arr) {qsort (arr, 0, arr.length - 1);} fonction qsort (arr, low, high) {if (Low <high) {var partykey = partition (arr, low, high); QSORT (Arr, Low, PartKey - 1); QSORT (Arr, PartKey + 1, High); }} Fonction partition (arr, low, high) {var key = arr [Low]; // utilise le premier élément comme base de classification tandis que (Low <High) {while (Low <High && arr [high]> = arr [key]) high--; arr [Low] = arr [high]; tandis que (bas <high && arr [bas] <= arr [key]) low ++; arr [high] = arr [bas]; } arr [Low] = Key; Retour bas;}Méthode 2 (en utilisant la méthode du tableau JS):
fonction Quicksort (arr) {if (arr.length <= 1) return arr; var index = math.floor (arr.length / 2); var key = arr.splice (index, 1) [0]; var gauche = [], droit = []; arr.ForEach (fonction (v) {v <= key? Left.push (v): droite.push (v);}); return Quicksort (gauche) .Concat ([clé], Quicksort (à droite));}De plus, il convient de noter que la complexité du temps moyenne du tri rapide O (NLOGN), le pire des cas est un cas ordonné, la complexité du temps est au carré et le tri rapide est instable.
Partie2 JavaScript lié
1 Types de données de base JavaScript
Les types de données JavaScript incluent des types et des types de référence primitifs, et il existe cinq types primitifs:
Numéro (valeur) String (String) boolean (boolean) null (vide) Undefined (Undefined)
Il existe un type de référence:
Objet (objet)
Grâce à Typeof (x), vous pouvez renvoyer les types de données "numéro", "String", "Boolean", "Undefined" et "Object" d'une variable x. Une chose à noter ici: l'opérateur TypeOf Renvoie un objet pour les types NULL.
"JavaScript Advanced Programming":
Il s'agit en fait d'un bogue dans l'implémentation initiale de JavaScript, qui a ensuite été utilisé par ECMAScript. Null est maintenant considéré comme un espace réservé pour l'objet, expliquant ainsi cette contradiction. Mais techniquement, c'est toujours la valeur d'origine.
2 Parlez de la chaîne de portée JavaScript
Lors de l'exécution d'un morceau de code JavaScript (code global ou fonction), le moteur JavaScript créera une portée pour lui, également connu sous le nom de contexte d'exécution. Une fois la page chargée, une portée globale sera créée en premier, puis chaque fonction sera exécutée, une portée correspondante sera établie, formant ainsi une chaîne de portée. Chaque portée a une chaîne de portée correspondante, la tête de la chaîne est la portée globale et la queue de la chaîne est la portée de la fonction actuelle.
Le but de la chaîne de portée est d'analyser les identifiants. Lorsque la fonction est créée (non exécutée), les arguments, les paramètres nommés et toutes les variables locales de la fonction seront ajoutées à la portée actuelle. Lorsque JavaScript doit trouver la variable X (ce processus est appelé résolution variable), il recherchera d'abord s'il y a un attribut x de la fin de la chaîne dans la chaîne de portée, c'est-à-dire la portée actuelle. S'il n'est pas trouvé, continuez à rechercher le long de la chaîne de portée jusqu'à ce que la tête de chaîne, c'est-à-dire la chaîne de portée globale, et la variable n'est pas trouvée, on pense qu'il n'y a pas de variable x sur la chaîne de portée de ce code, et une exception d'erreur de référence (référence) est lancée.
3 Comment comprendre la chaîne de prototypes JavaScript
Chaque objet de JavaScript a un attribut prototype, que nous appelons cela un prototype, et la valeur du prototype est également un objet, il a donc également son propre prototype, qui relie une chaîne prototype. L'en-tête de la chaîne prototype est un objet, et son prototype est relativement spécial, avec une valeur null.
La fonction de la chaîne prototype est utilisée pour l'héritage des objets. La propriété prototype de la fonction A est un objet. Lorsque cette fonction est utilisée comme constructeur pour créer une instance, la propriété prototype de la fonction sera attribuée à toutes les instances d'objet en tant que prototype. Par exemple, si nous créons un nouveau tableau, la méthode du tableau sera héritée du prototype du tableau.
Lorsque vous accédez à un attribut d'un objet, recherchez d'abord l'objet lui-même et retournez s'il est trouvé; S'il n'est pas trouvé, continuez à rechercher les propriétés de son objet prototype (s'il n'est toujours pas trouvé, il recherchera en fait le long de la chaîne prototype jusqu'à la racine). Tant qu'il n'est pas écrasé, les propriétés du prototype d'objet peuvent être trouvées dans tous les cas, et si la chaîne prototype entière n'est pas trouvée, elle reviendra non définie;
4 Déclaration variable JavaScript à l'avance
Le guide faisant autorité de JavaScript explique ceci: les variables JavaScript sont disponibles avant la déclaration, et cette fonctionnalité de JavaScript est appelée de manière informelle, c'est-à-dire que toutes les variables déclarées dans les fonctions JavaScript (mais n'impliquent pas les affectations) sont "avancées" en haut de la fonction.
D'un exemple:
var scope = "global"; fonction myfunc () {console.log (scope); var scope = "local";}Ce que la console imprime n'est pas "global" mais "non défini". En effet, dans la portée de la fonction MyFunc, la déclaration de portée variable locale est avancée en haut de la fonction. À l'heure actuelle, la portée déclare et n'attribue pas de valeurs, donc la sortie n'est pas définie. En fait, le code ci-dessus est le même que les suivants:
var scope = "global"; fonction myfunc () {var scope; console.log (portée); scope = "local";}5 Comment comprendre et appliquer les fermetures JavaScript
Les concepts donnés dans la littérature sur la définition spécifique des fermetures sont très abstraits. Je pense que les fermetures sont un mécanisme de syntaxe qui permet des fonctions à toutes les variables locales d'autres fonctions.
Par exemple:
function outfunc () {var name = "vicFeel"; fonction infunc () {console.log (name); } return infunc;} infunc (); // Console affiche "VicFeel"Nous pouvons voir cet exemple que le nom de variable local de OutFunc est toujours accessible dans la fonction Infunc.
Exemples d'application de fermeture, simule les propriétés privées d'une classe. Profitant des propriétés de la fermeture, les variables locales ne peuvent être accessibles que dans la méthode Sayage, et le nom est également accessible en externe, implémentant ainsi les propriétés privées de la classe.
fonction user () {this.name = "vicfel"; // L'attribut total Var Age = 23; // Attribut privé This.sayage: function () {console.log ("mon âge est" + âge); }} var user = new User (); console.log (user.name); // "vicfel" Console.log (user.age); // User.sayage "non défini" (); // "Mon âge a 23 ans"Pour en savoir plus sur les fermetures, je recommande le journal réseau de Ruan Yifeng - Apprenez la fermeture JavaScript (fermeture).
6 L'essence du nouvel objet de construction
fonction user () {this.name = "vicFeel"; this.age = 23;} var user = new User ();Grâce au nouvel opérateur, les opérations suivantes sont réellement terminées dans l'utilisateur du constructeur:
• Créez un nouvel objet dont le type est un objet;
• Définir les propriétés internes, accessibles et prototypes de ce nouvel objet telles que définies dans le constructeur (se référant au constructeur pointé par Prototype.Contrutor);
• Exécuter le constructeur;
• Renvoie l'objet nouvellement créé.
fonction user () {// this = {}; //this.constructor = utilisateur; this.name = "vicfeel"; this.age = 23; // retourne ceci; } var user = new User ();Si le constructeur renvoie un objet nouvellement créé par défaut, si une variable est renvoyée manuellement, elle n'est pas valide si la variable est du type d'origine, et s'il s'agit d'un objet, il est renvoyé.
7 agent javascript
Lorsque nous devons ajouter des événements à de nombreux éléments, nous pouvons déclencher la fonction de traitement en ajoutant des événements à leur nœud parent et en déléguant des événements au nœud parent.
Par exemple, nous devons ajouter dynamiquement de nombreux Li à un UL, et nous devons traverser Li pour ajouter des événements de clic un par un.
<ul id = 'list'> </ul> var count = 100; var ullist = document.getElementById ("list"); // Node de construction dynamique pour (var i = count; i -;) {var lidom = document.createElement ('li'); ullist.appendChild (lidom); } // Binding Click Event var linode = uLlist.getElementByTagName ("li"); pour (var i = 0, l = linodes.length; i <l; i ++) {linode [i] .onclick = function () {// li click event}}Comme nous le savons tous, les opérations DOM sont très consommatrices de performances. La liaison répétée des événements est donc simplement un tueur de performance. L'idée principale du proxy d'événements est d'écouter autant d'événements que possible à travers le moins de liaisons possible. Comment faire? La réponse consiste à utiliser le mécanisme de bulle d'événement pour lier le nœud parent UL (bulle d'événement), puis utiliser event.target pour déterminer quel nœud déclenche l'événement, réduisant ainsi la liaison de nombreux Handlers d'événements.
Var Count = 100; var ullist = document.getElementById ("list"); // Node de construction dynamique pour (var i = count; i -;) {var lidom = document.createElement ('li'); ullist.appendChild (lidom); } // Binding Click Event var linode = uLlist.getElementByTagName ("li"); linode.onclick = function (e) {if (e.target && e.target.nodename.touppercase == "li") {// li click event}}Le nouveau contenu sera mis à jour en continu ...