recherche

Maison  >  Article  >  interface Web  >  Plongez dans les bases de JavaScript

Plongez dans les bases de JavaScript

php中世界最好的语言
php中世界最好的语言original
2018-03-13 13:19:551365parcourir

Cette fois, je vais vous présenter en profondeur les Applications de base de JavaScript, Quelles sont les précautions pour l'utilisation des applications de base de JavaScript, les suivantes sont pratiques cas, jetons un coup d'œil ensemble Jetez un œil.

Valeur de retour de la fonction

Valeur de retour 1

<script>function show(){    return &#39;advb&#39;;
}var a=show();
alert(a); // 结果: advb</script>

Valeur de retour 2

<script>function show(a, b){    return a+b;
}
alert(show(3, 5));</script>

Valeur de retour 3

<script>function show(a, b){    //return; //没有return}
alert(show(3, 5));  //结果 : undefined</script>
<script>function show(a, b){    return; //没有return任何东西}
alert(show(3, 5));  //结果 : undefined</script>

Résumé général

<script>function sum(a, b){    return a+b;
}
alert(sum(12, 6));</script>

Somme de plusieurs paramètres (les arguments sont un tableau de variables)

<script>
    function sum()    {        //arguments 是一个可变数组 
        var result=0;        for(var i=0;i<arguments.length;i++)
        {
            result+=arguments[i];
        }        return result;
    }
    alert(sum(12, 6, 8, 6, 8, 6, 8)); //结果 : 54</script>```

- La fonction CSS obtient l'attribut lorsque deux paramètres sont passés dans , lorsque vous utilisez trois paramètres, modifiez le style 

<html>
<head>
<meta charset="utf-8">
<title>CSS函数</title>
<script>
function css(obj, name, value)
{
if(arguments.length==2) //获取
{
return obj.style[name];
}
else
{
obj.style[name]=value; //修改
}
}
window.onload=function ()
{
var oDiv=document.getElementById(&#39;div1&#39;);
//alert(css(oDiv, &#39;width&#39;)); //获取到宽度 200px
css(oDiv, &#39;background&#39;, &#39;green&#39;); //修改背景颜色为绿色
};
</script>
</head>
<body>
<div id="div1" style="width:200px; height:200px; background:red;">
</div>
</body>
</html>
function getStyle(obj, name)
{if(obj.currentStyle) //由于currentStyle只兼容IE,所以在IE浏览器中他是true,其他浏览器中为false
{
return obj.currentStyle[name]; //IE
}
else
{    //计算样式 其中getComputedStyle(oDiv, xxx) 第二个参数可以随便填,一般习惯写false
return getComputedStyle(obj, false)[name];  //Chrome、FF
}
}

Exemple de code :
Utilisez la fonction ci-dessus pour obtenir le style non interligne `backgroundColor`

window.onload=function (){var oDiv=document.getElementById(&#39;div1&#39;);
alert(getStyle(oDiv, &#39;backgroundColor&#39;));
};

###Note3499910bf9dac5ae3c52d5ede7383485Cette fonction n'est applicable qu'à un seul style, les styles composés ne sont pas applicables !!!5db79b134e9f6b82c0b36e0489ee08ed
Style unique : largeur, hauteur, position, etc.
Style composite : arrière-plan, bordure, etc.
>###3. Tableau - Bases du tableau
- Utilisation du tableau
Définition 

var arr=[12, 5, 8, 9]; //一般用这种创建方式,简单
var arr=new Array(12, 5, 8, 9); //也可以这样创建

Il y a aucune différence, [] Les performances sont légèrement supérieures car le code est court

- L'attribut du tableau
longueur

peut être obtenu et défini : ① .Le nombre de tableaux peut être obtenu, ②.Vous pouvez également utiliser array.length = 1; pour définir le nombre de tableaux ;
Exemple : effacez rapidement le tableau //Utilisez array.length = 0; ;
Principes d'utilisation des tableaux : Dans le tableau Il ne doit y avoir qu'un seul type de variable

- Méthode Array
Ajouter

push(element), ajouter un élément à partir de la fin

unshift(element), de Ajouter un élément

en tête et supprimer

pop(), supprimer un élément de la queue
shift( ), supprimer un élément de la tête

- Insertion et suppression de `splice` (`symbole phonétique :[splaɪs]`) : Fonctionnement universel du tableau
Supprimer

splice (début, longueur) //Premier paramètre : Spécifier la position ; Deux paramètres : Spécifier la longueur

Insérer

splice(début, 0, élément...)

Supprimer d'abord, puis insérer

splice(start, length, element...)
Supprimer d'abord, puis insérer

Remplacer

Supprimer d'abord, puis insérer peut être utilisé en remplacement

- Connexion au tableau (fusion de deux tableaux) : concatconcat(array 2)
Connecter deux tableaux

<script>
var a = [1,2,3];
var b = [4,5,6];
alert(a.concat(b)); 结果:[1,2,3,4,5,6];
alert(b.concat(a)); 结果:[4,5,6,1,2,3];
</script>

- rejoindre (séparateur)
Utilisez le séparateur pour combiner les éléments du tableau, Générez une chaîne (lors de l'apprentissage d'ajax, utilisez-la pour vous connecter à l'URL) 

<script>
var arr = [1,2,3,4];
alert(arr.join(&#39;-&#39;)) //1-2-3-4
alert(arr.join(&#39;- -p&#39;)) //1- -p2- -p3- -p4
</script>

- Séparation de chaîne (`[splɪt] ` séparé; décomposer) La méthode split() est utilisée pour diviser une chaîne en un tableau de chaînes. stringObject.split(separator,howmany)

séparateur Obligatoire. Une chaîne ou une expression régulière pour diviser le stringObject à partir de l'endroit spécifié par ce paramètre.
combien en option. Ce paramètre spécifie la longueur maximale du tableau renvoyé. Si ce paramètre est défini, pas plus de sous-chaînes ne seront renvoyées que le tableau spécifié par ce paramètre. Si ce paramètre n'est pas défini, la chaîne entière sera divisée quelle que soit sa longueur.

Utilisez

Si vous souhaitez diviser un mot en lettres, ou une chaîne en caractères, utilisez le code suivant : 

"hello".split("")   //可返回 ["h", "e", "l", "l", "o"]


Si vous n'avez besoin de renvoyer qu'une partie des caractères, veuillez utiliser combien de paramètres : 

"hello".split("", 3)    //可返回 ["h", "e", "l"]

- trier sort`sort([fonction de comparaison])`, trier un tableau
Trier Tableau de chaînes à un caractère
Trier un tableau numérique
① Trier un tableau de chaînes 

<script>
var arr=[&#39;float&#39;, &#39;width&#39;, &#39;alpha&#39;, &#39;zoom&#39;, &#39;left&#39;];
arr.sort();
alert(arr); //结果 [&#39;alpha&#39;,&#39;float&#39;,&#39;left&#39;,&#39;width&#39;,&#39;zoom&#39;]
</script>

② Trier un tableau numérique - 2.1 Basic Edition 

<script>
var arr=[12, 8, 99, 19, 112];
arr.sort();
alert(arr); //结果: [112,12,19,8,99] //其实他把数字当成字符串来排序了
</script>

- Version 2.1 améliorée

<script>
var arr=[12, 8, 99, 19, 112];
arr.sort(function (n1, n2){
if(n1<n2)
{
return -1;//只要是个负数就可以 -2,-7等都可以
}
else if(n1>n2)
{
return 1; //只要是个正数就够了
}
else
{
return 0;
}
});
alert(arr); //结果:[8,12,19,99,112]
</script>

- Version finale 2.2 (évolution de la 2.1)

<script>var arr=[12, 8, 99, 19, 112];
arr.sort(function (n1, n2){    return n1-n2; //若果n1>n2,为正;如果n1<n2,为负;如果相等,则为0;});alert(arr);//结果:[8,12,19,99,112]
</script>

Je crois que vous maîtrisez la méthode après avoir lu le cas dans cet article , pour un contenu plus passionnant, veuillez faire attention au site Web chinois php autres articles connexes !

Lecture recommandée :

Attributs liés à l'arrière-plan en HTML et CSS

8 connaissances de base auxquelles vous devez prêter attention en JS

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!

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
Article précédent：8 connaissances de base de JS auxquelles vous devez prêter attentionArticle suivant：8 connaissances de base de JS auxquelles vous devez prêter attention

Articles Liés

Voir plus