Compilation de points de connaissances JavaScript_compétences Javascript

JavaScript est un langage de script littéral. Il s'agit d'un langage basé sur un prototype à typage dynamique, faiblement typé, avec prise en charge intégrée des types. Son interpréteur s'appelle le moteur JavaScript, qui fait partie du navigateur et est largement utilisé dans les langages de script côté client. Il a été utilisé pour la première fois sur les pages Web HTML (une application sous Standard Universal Markup Language) pour ajouter des fonctions dynamiques aux pages Web HTML. .

Tout d’abord, utilisons une description textuelle plus officielle pour expliquer JavaScript :

JavaScript est un langage de script littéral. Il s'agit d'un langage basé sur un prototype à typage dynamique, faiblement typé, avec prise en charge intégrée des types.
Son interpréteur s'appelle le moteur JavaScript, qui fait partie du navigateur et est largement utilisé dans les langages de script côté client. Le premier est
. Utilisé sur les pages Web HTML (une application sous Standard Universal Markup Language) pour ajouter des fonctions dynamiques aux pages Web HTML.

JavaScript présente les caractéristiques suivantes :

· Langage de script. JavaScript est un langage de script interprété. Les langages tels que C et C sont d'abord compilés puis exécutés, tandis que JavaScript est interprété ligne par ligne lors de l'exécution du programme.
· Basé sur des objets. JavaScript est un langage de script basé sur les objets qui peut non seulement créer des objets mais également utiliser des objets existants.
· Simple. Le langage JavaScript utilise des types de variables faiblement typés et n'impose pas d'exigences strictes sur les types de données utilisés. Il s'agit d'un langage de script basé sur les instructions et contrôles de base de Java, et sa conception est simple et compacte.
· Dynamique. JavaScript est un langage de script basé sur des événements qui peut répondre aux entrées de l'utilisateur sans passer par un serveur Web. Lors de la visite d'une page Web, JavaScript peut répondre directement à ces événements lorsque la souris est cliquée, déplacée vers le haut ou vers le bas ou déplacée dans la fenêtre.
· Multiplateforme. Le langage de script JavaScript ne dépend pas du système d'exploitation et nécessite uniquement la prise en charge du navigateur. Par conséquent, après avoir écrit un script JavaScript, il peut être utilisé sur n'importe quelle machine, à condition que le navigateur de la machine prenne en charge le langage de script JavaScript. Actuellement, JavaScript est pris en charge par la plupart des navigateurs.

JavaScript se compose des parties suivantes :

·ECMAScript, décrit la syntaxe et les objets de base du langage.
· Document Object Model (DOM), qui décrit les méthodes et les interfaces de traitement du contenu Web.
· Modèle d'objet de navigateur (BOM), qui décrit les méthodes et interfaces permettant d'interagir avec le navigateur.

Quels types de données existe-t-il en JavaScript ?

· L'objet objet comprend une fonction, une chaîne, un tableau, un objet, une date, etc.
· chaîne
· numéro
· booléen
· nul
· non défini

La partie suivante du code prouve ce qui précède :

La chaîne et le nombre sont des objets, la chaîne et le nombre sont des formats de données différents...

var str = "abc";
var Str = new String("abc");
var num = 100;
var Num = nouveau Nombre (100);
console.log(typeof str, typeof Str, typeof num, typeof Num); // chaîne objet numéro objet

Qu'est-ce que la chaîne de prototypes d'objets ?

Lorsque nous utilisons un nouvel objet (créé à l'aide du constructeur) ou créons un objet à l'aide de Object.create, alors l'objet aura un prototype et une chaîne de prototypes.
Par exemple : nous créons un constructeur _obj, puis utilisons _obj pour créer un nouvel obj. Ensuite, la chaîne de prototypes à ce moment est : obj → _obj → Object.prototype → null.

Illustrons-le à travers du code :

 function _obj(){};
 _obj.prototype.name = "野兽"; //每个函数都包含一个prototype属性，这个属性指向一个对象的引用，这个对象就是“原型对象”。
 _obj.prototype.age = 21;
 _obj.prototype.sayHello = function(){
   console.log("Hello "+this.name);
 };
 var obj = new _obj();
 console.log(obj); //_obj{} 而其的__proto__里包含了_obj里的各个属性，包括name，age，sayHello 
 console.log(obj.__proto__ == _obj.prototype); //true
 obj.sayHello(); // Hello 野兽
 console.log(Object.prototype.__proto__); // null 当我们追究到Object(也就是object的源头时)其指向的是null 

Il est à noter que la chaîne de prototypes de Object.create(null) est directement nulle, ce qui signifie que la chaîne de prototypes est très courte...

Comment jouer avec le scope en JavaScript ?

Lorsque nous utilisons var pour déclarer une variable en JavaScript, nous ajoutons en fait un attribut et une valeur d'attribut à l'objet pointé par la portée.
Il n'y a pas de portée au niveau du bloc en JavaScript. Les variables déclarées dans la portée actuelle ne sont disponibles que dans la portée actuelle et les fonctions dans la portée actuelle, tandis que les variables déclarées dans une fonction ne sont disponibles que dans la fonction (si aucune opération n'est effectuée). appeler cette variable en dehors de la fonction signalera une erreur non définie.

Exécutons le code pour comprendre la portée :

 var firstNum = 1;
 ~function(){
   var secondNum = 2;
   console.log("在里面打印："+firstNum ,secondNum); // 在里面打印：1 2
 }();
 console.log("在外面打印："+firstNum ,secondNum); // Uncaught ReferenceError: secondNum is not defined(…) 

Les scopes ont également des chaînes de scopes :

 var firstNum = 1;
 console.log("在最外层打印："+firstNum); // 在最外层打印：1
 ~function(){
   var secondNum = 2;
   console.log("在中间层打印："+firstNum,secondNum); // 在中间层打印：1 2
   ~function(){
     var thirdNum = 3;
     console.log("在最里层打印："+firstNum,secondNum,thirdNum); // 在最里层打印：1 2 3
   }();
   console.log("在中间层打印："+firstNum,secondNum,thirdNum); // Uncaught ReferenceError: thirdNum is not defined(…)
 }();
 console,log("在最外层打印："+firstNum,secondNum,thirdNum); // 由于上面已经报错，而浏览器执行JavaScript又是单线程的，所以压根没执行到这句... 

En d'autres termes, les variables déclarées dans le scope actuel seront toujours disponibles dans ses sous-scopes, ce qui est cool, haha...

Qu'est-ce qu'une fermeture ? Comment jouer ?

L'exécution de la fonction dépend de la portée de la variable. Cette portée est déterminée lorsque la fonction est définie, et non lorsque la fonction est appelée. Afin d'obtenir ce type de portée lexicale, l'état interne d'un objet fonction JavaScript contient non seulement le code logique de la fonction, mais doit également faire référence à la chaîne de portée actuelle. Les objets de fonction peuvent être liés les uns aux autres via des chaînes de portée, et les variables à l'intérieur du corps de la fonction peuvent être stockées dans la portée de la fonction. Cette fonctionnalité est en fait une « fermeture ».
Continuons à regarder le code :

function counter(){
  var num = 0;
  return {
   count : function(){ return num++; },
   reset : function(){ return num = 0; }
  }
 };
 var firstNum = counter();
 var secondNum = counter();
 console.log(firstNum.count()); // 0
 console.log(secondNum.count()); // 0
 firstNum.reset();
 console.log(firstNum.count()); // 0 num已被重置，所以返回的为0
 console.log(secondNum.count()); // 1 num未被重置，所以返回的是1
 console.log(firstNum,secondNum); // 都为 Object{ count:function(),reset:function(),__proto__} 并且并不能在其中找到counter里var的n，这也实现了函数里的私有变量，只将需要暴露的两个方法给暴露在外。 

闭包用的多的两个作用：读取函数内部的变量值；让这些变量值始终保存着(在内存中)。
同时需要注意的是：闭包慎用，不滥用，不乱用，由于函数内部的变量都被保存在内存中，会导致内存消耗大。

JavaScript中的this

在JavaScript中，this通常指向的是我们正在执行的函数本身，或者是，指向该函数所属的对象。

全局的this → 指向的是Window
函数中的this → 指向的是函数所在的对象
对象中的this → 指向其本身

验证代码：

 console.log(this); // Window {external: Object, chrome: Object, document: document, global: Window, cr: Object…} 全局下执行console.log,所以此处指向的是Window
 ~function seeThis(){
  console.log(this); // Window {external: Object, chrome: Object, document: document, global: Window, cr: Object…} 由于我是在全局下写的这个函数，所以此处指向的还是Window
 }();
 var obj = {
  name:"野兽",
  showThis:function(){
   console.log(this); // Object {name: "野兽",showThis:function(),__proto__} 此处打印的是对象本身
  }
 };
 obj.showThis(); 

arguments

在Javascript函数体内，arguments像数组一样（并不是真的数组），有length属性，可以代表传给函数的参数的个数。

简单来说，arguments函数执行时所传的实际参数。
比如：arguments[0]表示传入第一个参数。

用代码验证：

 function argumentsTest(){
  console.log(arguments[0]?arguments[0]:"Hello World",arguments[1]?arguments[1]:"你好 世界")
 };
 argumentsTest(); // Hello World 你好 世界
 argumentsTest("This is firstValue => arguments[0].","This is secondValue => arguments[1]."); // This is firstValue => arguments[0]. This is secondValue => arguments[1]. 

好了，关于javascript知识点先给大家整理这么些，全当温习下知识点，本文写的不好，还望各位朋友多多指教。