suchen

Heim  >  Artikel  >  Web-Frontend  >  Tauchen Sie tief in die Grundlagen von JavaScript ein

Tauchen Sie tief in die Grundlagen von JavaScript ein

php中世界最好的语言
php中世界最好的语言Original
2018-03-13 13:19:551376Durchsuche

Dieses Mal werde ich Ihnen ausführliche Grundlegende Anwendungen von JavaScript vorstellen, Was sind die Vorsichtsmaßnahmen für die Verwendung grundlegender Anwendungen von JavaScript, das Folgende ist praktisch Fälle, lasst uns gemeinsam einen Blick darauf werfen. Schaut mal rein.

Funktionsrückgabewert

Rückgabewert 1

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

Rückgabewert 2

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

Rückgabewert 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>

Allgemeine Summierung

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

Summe mehrerer Parameter (Argumente ist ein Variablenarray)

<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>```

- CSS-Funktion ruft das -Attribut ab, wenn zwei Parameter in übergeben werden , wenn Sie drei Parameter verwenden, ändern Sie den Stil 

<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
}
}

Beispielcode:
Verwenden Sie die obige Funktion, um den Nicht-Interline-Stil „backgroundColor“ zu erhalten

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

###Hinweis3499910bf9dac5ae3c52d5ede7383485Diese Funktion ist nur auf einen einzelnen Stil anwendbar, zusammengesetzte Stile sind nicht anwendbar!!!5db79b134e9f6b82c0b36e0489ee08ed
Einzelner Stil: Breite, Höhe, Position usw.
Zusammengesetzter Stil: Hintergrund, Rahmen usw.
>###3. Array – Array-Grundlagen
– Array-Verwendung
Definition 

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

Es gibt Kein Unterschied, [] Die Leistung ist etwas höher, da der Code kurz ist

- Das Attribut des Arrays
Länge

kann abgerufen und festgelegt werden: ① . Die Anzahl der Arrays kann ermittelt werden, ②. Sie können auch array.length = 1 verwenden, um die Anzahl der Arrays festzulegen;
Beispiel: Löschen Sie das Array schnell //Verwenden Sie array.length = 0; ;
Array-Verwendungsprinzipien: Im Array sollte es nur einen Variablentyp geben

- Array-Methode

push(element) hinzufügen, am Ende ein Element hinzufügen

unshift(element), von Füge ein Element

zum Kopf hinzu und lösche

pop(), lösche ein Element vom Ende
shift() , ein Element aus dem Kopf löschen

- Einfügen und Löschen von „splice“ („phonetisches Symbol:[splaɪs]“): Universelle Operation des Arrays
Löschen

splice( start, length) //Erster Parameter: Position angeben; Zwei Parameter: Länge angeben

Einfügen

spleiß(start, 0, element...)

Zuerst löschen, dann einfügen

Spleiß(Anfang, Länge, Element...)
Zuerst löschen, dann einfügen

Ersetzen

Löschen Zuerst kann Einfügen als Ersatz verwendet werden

- Array-Verbindung (Zusammenführen zweier Arrays):concatconcat(array 2)
Zwei Arrays verbinden

<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>

- join( Trennzeichen)
Verwenden Sie das Trennzeichen, um Array-Elemente zu kombinieren. Generieren Sie eine Zeichenfolge (beim Lernen von Ajax verwenden Sie diese, um eine Verbindung zur URL herzustellen) 

<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>

- Zeichenfolgenaufteilung (`[splɪt]` separat; zerlegen) Die Methode split() wird verwendet, um einen String in ein String-Array aufzuteilen. stringObject.split(separator,howmany)

separator Erforderlich. Eine Zeichenfolge oder ein regulärer Ausdruck zum Teilen des stringObject ab der durch diesen Parameter angegebenen Stelle.
wieviele optional. Dieser Parameter gibt die maximale Länge des zurückgegebenen Arrays an. Wenn dieser Parameter festgelegt ist, werden nicht mehr Teilzeichenfolgen zurückgegeben als das durch diesen Parameter angegebene Array. Wenn dieser Parameter nicht gesetzt ist, wird die gesamte Zeichenfolge unabhängig von ihrer Länge aufgeteilt.

Verwenden Sie

Wenn Sie ein Wort in Buchstaben oder eine Zeichenfolge in Zeichen aufteilen möchten, verwenden Sie den folgenden Code: 

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


Wenn Sie nur einen Teil der Zeichen zurückgeben müssen, verwenden Sie bitte howmany-Parameter: 

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

- sort sort`sort([comparison function])`, sortieren Sie ein Array
Sortieren Ein-Zeichen-String-Array
Sortieren Sie ein numerisches Array
① Sortieren Sie ein String-Array 

<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>

② Sortieren Sie ein numerisches Array – 2.1 Basic Edition 

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

- 2.1 aktualisierte Version

<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>

- 2.2 endgültige Version (weiterentwickelt aus 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>

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall gelesen haben Weitere spannende Inhalte in diesem Artikel finden Sie auf der chinesischen PHP-Website anderen verwandten Artikeln!

Empfohlene Lektüre:

Hintergrundbezogene Attribute in HTML und CSS

8 Grundkenntnisse, auf die Sie achten müssen in JS

Das obige ist der detaillierte Inhalt vonTauchen Sie tief in die Grundlagen von JavaScript ein. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：8 Grundkenntnisse von JS, auf die Sie achten müssenNächster Artikel：8 Grundkenntnisse von JS, auf die Sie achten müssen

In Verbindung stehende Artikel

Mehr sehen