Maison > Article > interface Web > js variables de contexte d'exécution, fonctions, ceci
Cet article présente principalement les variables de contexte d'exécution de js, les fonctions, etc. Il a une certaine valeur de référence. Maintenant, je le partage avec tout le monde. Les amis dans le besoin peuvent se référer à
Exécution dans un contexte JavaScript. et pile d'appels
Portée et promotion des variables ES6 : explication détaillée du cycle de vie des variables
La définition des variables est en le code Lors de la préparation, définir
en haut du scope sans var sans variable promotion
console.log(a); // undefined,如果没有定义会直接报错 var a = 'aaa'; console.log(a); // aaa // 下面代码全等于上面代码 var a; // 变量提升,函数作用域范围内 console.log(a); // undefined a = 'aaa'; console.log(a); // aaa console.log(a); // 直接报错 a = 'aaa';
La définition de la fonction est définie en haut de la portée lors de la pré-analyse du code
L'affectation de la fonction est en haut de la portée
console.log(f1); // f1() { console.info('函数'); } var f1 = function() { console.info('变量'); } console.log(f1); // ƒ () { console.info('变量'); } function f1() { console.info('函数'); } console.log(f1); // ƒ () { console.info('变量'); } // 下面代码全等于上面代码 var f1; // 定义提升 function f1() { console.info('函数'); } // 函数顶部赋值 console.log(f1); // f1() { console.info('函数'); } f1 = function() { console.info('变量'); } console.log(f1); // ƒ () { console.info('变量'); } console.log(f1); // ƒ () { console.info('变量'); }
Le contexte d'une fonction est déterminé lors de sa définition
var scope = "global scope"; function checkscope() { var scope = "local scope"; function f() { return scope; } return f; } checkscope()(); // local scope
Le contexte de ceci est déterminé lors de l'exécution
// 在 function 里 function test() { var type = this === window; return type; } test(); // true
// 在对象里 var obj = { test: function() { var type = this === obj; return type; } }; obj.test(); // true // 在 prototype 对象的方法中 function obj() { } obj.prototype.test = function() { return this; } var o = new obj(); o.test() === o; // true
// 调用 new 构造对象时 function obj() { this.test = function() { return this; } } var o = new obj(); o.test() === o; // true
function test() { return this; } var o = {}; // apply test.apply(o) === o; // true // call test.call(o) === o; // true
// 点击后输出 true <input id="a" type="text" onclick="console.info(this === document.getElementById('a'))" /> // 点击后输出 true <input id="a" type="text" /> <script type="text/javascript"> document.getElementById('a').addEventListener("click", function(){ console.info(this === document.getElementById('a')); }); </script> // 点击后输出 true <input id="a" type="text" /> <script type="text/javascript"> document.getElementById('a').onclick = function(){ console.info(this === document.getElementById('a')); }); </script>
Ce qui précède est l'intégralité du contenu de cet article. J'espère qu'il sera utile à l'étude de chacun. Pour plus de contenu connexe, veuillez faire attention. au site Web PHP chinois !
Recommandations associées :
JS et JQ implémentent l'effet carrousel du graphique de focus
js implémente l'édition en cliquant sur le bouton
À propos de JS
Introduction à l'héritage
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!