Résumé des méthodes JavaScript courantes_Connaissances de base

Ce chapitre ne fournit pas une explication approfondie de certains des principes sous-jacents de js, tels que ce pointeur, cette portée et ces prototypes. Il implique certaines choses qui sont bénéfiques pour simplifier le code et améliorer l'efficacité de l'exécution lors du développement quotidien, ou qui peuvent le faire. être utilisé comme méthode empirique, la longueur n'est pas longue et vous pouvez lire l'intégralité de l'article par petites étapes et découvrir la joie de la programmation.

Obtenez des nombres aléatoires dans deux intervalles

Copier le code Le code est le suivant :

function getRandomNum(Min, Max){ // Obtenez des nombres aléatoires dans deux intervalles
// @Backfire Crazy a proposé qu'il soit possible que le premier paramètre soit supérieur au deuxième paramètre, donc ajouter un peu plus de jugement est plus fiable
Si (Min > Max)
Max = [Min, Min = Max][0]; // Échangez rapidement deux valeurs variables
 
var Plage = Max - Min 1;
var Rand = Math.random();
Retour Min Math.floor(Rand * Range);
};

Renvoie aléatoirement un paramètre positif/négatif

Copier le code Le code est le suivant :

function getRandomXY(num){ // Renvoie aléatoirement un paramètre positif/négatif
num = nouveau Nombre(num);
Si (Math.random() <= 0,5)
         num = -num;
Renvoie le numéro ;
>

Fonction de minuterie setInterval() ou setTimeOut() passant des paramètres

Copier le code Le code est le suivant :

var s = 'Je suis un paramètre';
fonction fn(args) {
console.log(args);
>
var a = setInterval(fn(s),100); // erreur xxxxxx xxxxx
var b = setInterval(function(){ // Correct, utilisez la fonction anonyme pour appeler la fonction chronométrée
fn(s);
}, 100);

le minuteur setInterval() ou setTimeOut() appelle de manière récursive

Copier le code Le code est le suivant :

var s = vrai ;
function fn2(a, b){                // Étape 3
Si(s) {
         clearInterval(a);
         clearInterval(b);
>
};
function fn(a){ // Étape 2
var b = setInterval(function(){
              fn2(a, b) // Passer en deux minuteries
}, 200)
};
var a = setInterval(function(){ // Étape 1
fn(a); // b représente le minuteur lui-même, qui peut être passé en paramètre de siège
}, 100);

Convertir la chaîne en nombre

Copier le code Le code est le suivant :

// Pas besoin de new Number(String) ni de Number(String). Soustrayez simplement zéro de la chaîne
. var str = '100'; // str : Chaîne
var num = str - 0;// num : Nombre

Jugement de valeur nul

Copier le code Le code est le suivant :

var s = ''; // Chaîne vide
if(!s) // La chaîne vide est convertie en booléen false par défaut et peut être écrite directement dans l'instruction de jugement
if(s != null) // Mais chaîne vide != null
if(s != non défini) // Chaîne vide également != non défini

Méthode parseInt() du navigateur IE

Copier le code Le code est le suivant :

// La conversion suivante est 0 dans IE et 1 dans les autres navigateurs. Ceci est lié au système de base utilisé par le navigateur IE pour interpréter les nombres
. var iNum = parseInt(01);
// La méthode d'écriture compatible est donc
var num = parseInt (nouveau numéro (01));

Firebug débogue facilement le code js

Copier le code Le code est le suivant :

//Firebug possède un objet console intégré qui fournit des méthodes intégrées pour afficher les informations
/**
* 1 : console.log(), qui peut être utilisé pour remplacer alert() ou document.write(), prend en charge la sortie d'espace réservé, les caractères (%s), les entiers (%d ou %i), les nombres à virgule flottante (%f ) et l'objet (%o). Par exemple : console.log("%d année %d mois %d jour", 2011,3,26)
*2 : S'il y a trop d'informations, elles peuvent être affichées en groupes. Les méthodes utilisées sont console.group() et console.groupEnd()
. *3 : console.dir() peut afficher toutes les propriétés et méthodes d'un objet
* 4 : console.dirxml() permet d'afficher le code html/xml contenu dans un nœud de la page web
* 5 : assertion console.assert(), utilisée pour déterminer si une expression ou une variable est vraie
* 6 : console.trace() est utilisé pour suivre la trace appelante de la fonction
* 7 : console.time() et console.timeEnd(), utilisés pour afficher le temps d'exécution du code
* 8 : L'analyse des performances (Profiler) consiste à analyser le temps d'exécution de chaque partie du programme et à découvrir où se trouve le goulot d'étranglement. La méthode utilisée est console.profile()....fn....console.profileEnd(. )
​*/

Obtenez rapidement l'heure actuelle en millisecondes

Copier le code Le code est le suivant :

// t == Valeur actuelle en millisecondes du système, raison : L'opérateur de signe appellera la méthode valueOf() de Date.
var t = nouvelle Date();

Obtenez rapidement des décimales

Copier le code Le code est le suivant :

// x == 2, les valeurs x suivantes sont toutes 2, les nombres négatifs peuvent également être convertis
var x = 2,00023 | 0;
//x = '2.00023' | 0;

Interchangez les valeurs de deux variables (aucune quantité intermédiaire n'est utilisée)

Copier le code Le code est le suivant :

var a = 1;
varb = 2;
une = [b, b=une][0]
alert(a '_' b) // Résultat 2_1, les valeurs de a et b ont été interchangées.

Opérateur logique OU '||'

Copier le code Le code est le suivant :

// b n'est pas nul : a=b, b est nul : a=1.
var a = b || 1;
// L'utilisation la plus courante consiste à transmettre des paramètres à une méthode de plug-in et à obtenir l'élément cible de l'événement : event = event || // IE a un objet window.event, mais pas FF.

Seuls les objets méthode ont des attributs de prototype

Copier le code Le code est le suivant :

// La méthode a l'attribut prototype d'objet prototype, mais les données d'origine n'ont pas cet attribut, comme var a = 1, a n'a pas l'attribut prototype
function Person() {} // Constructeur de personne
Person.prototype.run = function() { alert('run...'); } // Méthode d'exécution du prototype
Personne.run(); // erreur
var p1 = new Person(); // Uniquement lors de l'utilisation de l'opérateur new, la méthode d'exécution du prototype sera affectée à p1
p1.run(); // exécuter...

Obtenez rapidement le jour de la semaine

Copier le code Le code est le suivant :

// Calcule le jour de la semaine où est l'heure actuelle du système
var week = "Aujourd'hui c'est : semaine" "Jour un, deux, trois, quatre, cinq, six".charat(new date().getDay());

Biais de fermeture

Copier le code Le code est le suivant :

/**
* Fermeture : tout corps de méthode js peut être appelé une fermeture. Cela ne se produit pas uniquement lorsqu'une fonction en ligne fait référence à un paramètre ou à un attribut d'une fonction externe.
* Il a une portée indépendante, dans laquelle il peut y avoir plusieurs sous-portées (c'est-à-dire des méthodes imbriquées de méthode. En fin de compte, la portée de fermeture est la portée de la méthode la plus externe
). * Il inclut ses propres paramètres de méthode et les paramètres de méthode de toutes les fonctions intégrées, donc lorsqu'une fonction intégrée a une référence externe, la portée de la référence est la portée de la méthode (de niveau supérieur) où se trouve la fonction référencée
​*/
fonction a(x) {
Fonction b(){
alert(x); // Paramètres de fonction externes de référence
>
Retour b;
>
var run = a('run...');
// En raison de l'expansion de la portée, les variables de la fonction externe a peuvent être référencées et affichées
run(); // alert(): run..

Obtenir la chaîne de paramètres d'adresse et actualiser régulièrement

Copier le code Le code est le suivant :

// Vous avez un point d'interrogation ? Le contenu suivant comprend des points d'interrogation
var x = window.location.search
// Récupère le contenu après le numéro de police #, y compris le numéro #
var y = window.location.hash
// Utilisez le minuteur pour actualiser automatiquement la page Web
window.location.reload();

Nul et non défini

Copier le code Le code est le suivant :

/**
* Le type Indéfini n'a qu'une seule valeur, qui est indéfinie. Lorsqu'une variable déclarée n'a pas été initialisée, la valeur par défaut de la variable n'est pas définie.
* Le type Null n'a également qu'une seule valeur, qui est null. Null est utilisé pour représenter un objet qui n'existe pas encore. Il est souvent utilisé pour indiquer qu'une fonction tente de renvoyer un objet inexistant.
* ECMAScript estime qu'undefined est dérivé de null, ils sont donc définis comme égaux.
* Cependant, si dans certains cas, il faut distinguer ces deux valeurs, que faire ? Vous pouvez utiliser les deux méthodes suivantes
* Lorsque vous portez des jugements, il est préférable d'utiliser un jugement de type fort '===' pour juger si un objet a une valeur.
​*/
var a;
alert(a === null); // false, car a n'est pas un objet vide
alert(a === undefined); // true, car a n'est pas initialisé, la valeur est indéfinie
// Extension
alert(null == undefined); // true, car l'opérateur '==' effectuera la conversion de type,
//De même
alerte(1 == '1'); // vrai
alert(0 == false); // true, false sont convertis en type Number 0

Ajouter dynamiquement des paramètres à la méthode

Copier le code Le code est le suivant :

// La méthode a a un paramètre supplémentaire 2
fonction a(x){
var arg = Array.prototype.push.call(arguments,2);
alert(arguments[0] '__' arguments[1]);
>

Style de bordure SELECT personnalisé

Copier le code Le code est le suivant :

& Lt; option & gt; Personnalisez le style de bordure SELECT & lt;/option & gt;                                                                      222
                                                                                         

La palette de couleurs la plus simple

Copier le code Le code est le suivant :

Fonction, l'objet est un tableau ?

Copier le code Le code est le suivant :

var anObject = {}; //一個物件
anObject.aProperty = “Property of object”; //物件的一個屬性
anObject.aMethod = function(){alert(“Method of object”)}; //物件的一個方法
//主要看下面：
alert(anObject[“aProperty”]); //可以將物件當數組以屬性名稱作為下標來存取屬性
anObject[“aMethod”](); //可以將物件作為數組以方法名稱作為下標來呼叫方法
for( var s in anObject) //遍歷物件的所有屬性和方法進行迭代化處理
alert(s ” is a ” typeof(anObject[s]));
// 同樣對於function類型的物件也是一樣：
var aFunction = function() {}; //一個函數
aFunction.aProperty = “Property of function”; //函數的一個屬性
aFunction.aMethod = function(){alert(“Method of function”)}; //函數的一個方法
//主要看下面：
alert(aFunction[“aProperty”]); //可以將函數當數組以屬性名稱作為下標來存取屬性
aFunction[“aMethod”](); //可以將函數當數組以方法名稱作為下標來呼叫方法
for( var s in aFunction) //遍歷函數的所有屬性和方法進行迭代化處理
alert(s ” is a ” typeof(aFunction[s]));

複製程式碼 程式碼如下:

/**
 * 是的，物件和函數可以像數組一樣，用屬性名或方法名作為下標來存取並處理。
 * 那麼，它到底該算是數組呢，還是算對象？我們知道，數組應該算是線性資料結構，線性資料結構一般有一定的規律，適合進行統一的批量迭代操作等，有點像波。
 * 而物件是離散資料結構，適合用來描述分散的和個人化的東西，有點像粒子。
 * 因此，我們也可以這樣問：JavaScript 裡的物件到底是波還是粒子？如果存在對象量子論，那麼答案一定是：波粒二象性！
 * 因此，JavaScript裡的函數和物件既有物件的特徵也有陣列的特徵。這裡的陣列稱為“字典”，一種可以任意伸縮的名稱值對兒的集合。其實， object和function的內部實作就是一個字典結構，但這種字典結構卻透過嚴謹而精巧的語法表現出了豐富的外觀。正如量子力學在某些地方用粒子來 解釋和處理問題，而在另一些地方卻用波來解釋和處理問題。你也可以在需要的時候，自由選擇用物件還是陣列來解釋和處理問題。只要善於掌握 JavaScript 的這些奇妙特性，就可以寫出許多簡潔而強大的程式碼來。
 */

點選空白處能觸發某一元素關閉/隱藏

複製程式碼 程式碼如下:

/**
 * 有時頁面有個下拉式選單或什麼的效果，需要使用者點擊空白處或點選其他元素時將其隱藏
 * 可用一個全域document點選事件來觸發
 * @param {Object} "目標物件"
 */
$(document).click(function(e){
    $("目標物件").hide();
});
/**
 * 但有一個缺點就是當你點選該元素又想讓他顯示
 * 如果你不及時阻止事件冒泡至全域出發document物件點擊時，上面方法就會執行
 */
$("目標物件").click(function(event){
    event = event || window.event;
    event.stopPropagation(); // 點選目標物件時，及時阻止事件冒泡
    $("目標物件").toggle();
});

以上都是個人整理的一些常用的javascript小方法，記錄下來方便自己開發時直接拿來使用，這裡也推薦給有需要的小伙伴。

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