05_Grundlegende JavaScript-Syntax

1 Variable

1.1 Identifikator

Bei der Programmentwicklung ist es häufig erforderlich, einige Symbole anzupassen, um einige Namen zu kennzeichnen und ihnen bestimmte Verwendungszwecke zu geben, z. B. Variablennamen, Funktionsnamen usw. Diese Symbole werden als Bezeichner bezeichnet.

Regeln definieren

  • Es besteht aus Groß- und Kleinbuchstaben (AZ,az), Zahlen (0-9), Unterstrich (_) und Dollarzeichen ($).
  • Kann nicht mit einer Zahl beginnen.
  • Bitte beachten Sie unbedingt die Groß- und Kleinschreibung.
  • Die Benennung von Schlüsselwörtern in JavaScript kann nicht verwendet werden. Zum Beispiel: var, for, while.
  • Wir sollten unser Bestes geben, um „seine Bedeutung zu erkennen, wenn wir seinen Namen sehen“.
  • Obwohl die Kennung in Unicode-Codierung ausgedrückt wird und alle Inhalte von UTF-8 verwenden kann, wird nur Englisch empfohlen.

Beachten

  • Wenn mehrere Wörter in einem Bezeichner dargestellt werden müssen, umfassen gängige Darstellungsmethoden den Unterstrich (ungarische Nomenklatur) (z. B. Benutzername), die Kamelschrift (Kleinkamelbuchstaben-Nomenklatur) (z. B. Benutzername) und die Pascal-Methode (Großkamelbuchstaben-Nomenklatur) ( (z. B. Benutzername).
  • Die Unterstreichungsmethode wird normalerweise zum Benennen von Variablen verwendet, und die Camel-Case-Methode wird normalerweise zum Benennen von Funktionsnamen verwendet.

Klassenübungen:

Bestimmen Sie, ob die folgenden Bezeichner zulässig sind

it、It、to、to、age66、_age、789lu、$name

1.2 Reservierte Schlüsselwörter

  • Reservierte Schlüsselwörter: Bezieht sich auf Wörter, die im Voraus definiert wurden und denen in der JavaScript-Sprache eine besondere Bedeutung zugewiesen wurde.
brechen Fall fangen Klasse const weitermachen
Debugger Standard löschen Tun anders Export
erweitert FALSCH Endlich für Funktion Wenn
importieren In Instanz von neu Null zurückkehren
super schalten Das werfen versuchen WAHR
Art der War Leere während mit Ertrag

Hinweis: Schlüsselwörter können nicht als Variablennamen und Funktionsnamen verwendet werden, da sonst beim Laden von JavaScript Syntaxfehler auftreten.

  • Zukünftig reservierte Schlüsselwörter: Bezieht sich auf Wörter, die reserviert sind und möglicherweise in Zukunft zu reservierten Schlüsselwörtern werden.
abstrakt Argumente erwarten Byte Boolescher Wert verkohlen
doppelt Aufzählung evalu Finale schweben gehe zu
implementiert int Schnittstelle lassen lang einheimisch
Paket Privat geschützt öffentlich kurz statisch
synchronisiert wirft vergänglich flüchtig

Hinweis: Beim Definieren von Bezeichnern wird empfohlen, in Zukunft keine reservierten Schlüsselwörter mehr zu verwenden, um Fehler bei der zukünftigen Konvertierung in Schlüsselwörter zu vermeiden.

1.3 Die Rolle von Variablen

Variablen können als Container zum Speichern von Daten betrachtet werden. (Der Becher enthält Wasser, der Becher bezieht sich auf die Variable und das Wasser im Becher bezieht sich auf die in der Variablen gespeicherten Daten.)

Grammatik

  • Variablen in JavaScript werden normalerweise mit dem Schlüsselwort var deklariert, und die Benennungsregeln für Variablennamen sind dieselben wie für Bezeichner.
  • Zulässige Variablennamen (z. B. Zahl, _it123), unzulässige Variablennamen (z. B. 88shout, &num).
var sales;
var hits, hot, NEWS;
var room_101, room102;
var $name, $age;
  • Für Variablen, denen kein Anfangswert zugewiesen ist, wird der Standardwert auf undefiniert gesetzt.
  • Ein Semikolon am Ende einer Zeile zeigt das Ende einer Anweisung an.
  • Der Komma-Operator (,) zwischen Variablen kann die gleichzeitige Deklaration mehrerer Variablen in einer Anweisung realisieren.

1.4 Variablenzuweisung

// 声明变量、为变量赋值
var unit, room;
unit = 3;
room = 1001;

// 声明变量的同时为变量赋值
var fname = 'Tom', age = 12;

// 省略var关键字,直接为变量赋值
flag = false;
a = 1, b = 2;

Obwohl Variablen in JavaScript zugewiesen werden können, ohne sie vorher zu deklarieren, kann das Schlüsselwort var direkt weggelassen werden, um der Variablen einen Wert zuzuweisen. Da JavaScript jedoch eine dynamische Kompilierung verwendet, ist es nicht einfach, Fehler im Code zu finden, wenn das Programm ausgeführt wird. Daher wird empfohlen, eine gute Angewohnheit zu entwickeln, Variablen vor der Verwendung zu deklarieren.

1.5 Konstanten definieren

Es kann als eine Größe verstanden werden, deren Wert während der Ausführung des Skripts unverändert bleibt. Pi ist in der Mathematik eine Konstante, deren Wert fest ist und nicht geändert werden kann.

Merkmale: Einmal definiert, kann es nicht geändert oder neu definiert werden.

Syntax: Das Schlüsselwort const wird in ES6 hinzugefügt, um die Definition von Konstanten zu implementieren.

Regeln für die Benennung von Konstanten: Befolgen Sie die Regeln für die Benennung von Bezeichnern. Es ist üblich, für Konstantennamen immer Großbuchstaben zu verwenden.

Der Wert einer Konstante: Eine Konstante kann bei der Zuweisung bestimmte Daten oder der Wert eines Ausdrucks oder einer Variablen sein.

var r = 6;
const PI = 3.14;
const P = 2 * PI * r;
// 输出结果:P=37.68
console.log('P=' + P);
  • Sobald einer Konstanten ein Wert zugewiesen wurde, kann dieser nicht mehr geändert werden.
  • Einer Konstante muss bei der Deklaration ein Wert zugewiesen werden.

2 Datentypen

Bestimmen Sie bei der Verwendung oder Zuweisung eines Werts den entsprechenden Typ entsprechend dem spezifischen Inhalt der Einstellung. Aber jede Computersprache hat ihre eigenen unterstützten Datentypen, und JavaScript bildet da keine Ausnahme.

2.1 Datentypklassifizierung

  • Grundlegende Datentypen (Werttypen)
    • Boolescher Wert
    • Zahl (numerischer Typ)
    • String (Zeichentyp)
    • Null (leerer Typ)
    • Undefiniert (undefinierter Typ)
  • Referenzdatentyp: Objekt

Referenzdatentypen werden in späteren Kapiteln ausführlich vorgestellt.

Hinweis: In JavaScript ist jeder Wert, der kein numerischer Wert, keine Zeichenfolge, kein boolescher Wert, kein Symbol, null und undefiniert ist, ein Objekt.

2.2 Grundlegende Datentypen

2.2.1 Boolescher Typ

Boolean ist einer der am häufigsten verwendeten Datentypen in JavaScript und wird normalerweise für logische Urteile verwendet.

  • WAHR
  • FALSCH

Stellt das „Wahr“ und „Falsch“ der Dinge dar und folgt dabei strikt der Groß-/Kleinschreibung, sodass die Werte „wahr“ und „falsch“ nur dann boolesche Typen darstellen, wenn sie alle in Kleinbuchstaben geschrieben sind.

2.2.2 Numerischer Typ

Numerische Typen in JavaScript unterscheiden nicht zwischen Ganzzahlen und Gleitkommazahlen. Alle Zahlen sind numerische Typen.

  • Fügen Sie das „-“-Zeichen hinzu, um negative Zahlen anzuzeigen.
  • Fügen Sie das „+“-Zeichen hinzu, um positive Zahlen darzustellen (normalerweise lassen Sie das „+“ weg).
  • Auf NaN setzen, um einen nicht numerischen Wert anzugeben.
// 八进制数字序列范围:0~7
// 十六进制数字序列范围:0~9以及A~F
// 在JS中八进制前面加 0,十六进制前面加 0x
var oct = 032;		  // 八进制数表示的26
var dec = 26;		  // 十进制数26
var hex = 0x1a;		  // 十六进制数表示的26
var fnum1 = 7.26;	  // 标准格式
var fnum2 = -6.24;	  // 标准格式
var fnum3 = 3.14E6;	  // 科学计数法格式3.14*106
var fnum4 = 8.96E-3;  // 科学计数法格式8.96*10-3

Solange der angegebene Wert den für die numerische Angabe in JavaScript zulässigen Bereich nicht überschreitet.

besonderer Wert

  • Unendlichkeit steht für Unendlichkeit, größer als jeder Wert
  • -Unendlich, stellt ein Infinitesimal dar, kleiner als jeder Wert
  • NaN, Not a Number, stellt einen nicht numerischen Wert dar

NaN ist kein numerischer Wert

  • NaN ist eine Eigenschaft des globalen Objekts und sein Anfangswert ist NaN.
  • Wie der Sonderwert NaN in numerischen Typen stellen beide keine Zahl dar.
  • Kann verwendet werden, um anzugeben, ob bestimmte Daten numerischen Typs sind.
  • NaN hat keinen genauen Wert, sondern stellt nur einen Bereich nicht numerischer Typen dar.
  • Wenn beispielsweise NaN mit NaN verglichen wird, ist das Ergebnis möglicherweise nicht wahr (wahr), da die Daten, mit denen gearbeitet wird, beliebige Typen von Booleschen Werten, Zeichen, Null, Undefiniert und Objekten sein können.
2.2.3 Zeichentyp

Der Zeichentyp (String) ist eine Zeichenfolge, die aus Unicode-Zeichen, Zahlen usw. besteht. Wir nennen diese Zeichenfolge im Allgemeinen eine Zeichenfolge.

Funktion: Stellt den Datentyp des Textes dar.

Syntax: Zeichendaten im Programm werden in einfache Anführungszeichen (') oder doppelte Anführungszeichen (") eingeschlossen.

var slogan = 'Knowledge';		// 单引号,存放一个单词
var str = "the sky is blue."; 	// 双引号,存放一个句子
var color = '"red"blue'; 		// 单引号中包含双引号
var food = "'pizza'bread";		// 双引号中包含单引号
var num = '', total = "";		// 定义空字符串
  • Eine durch einfache Anführungszeichen getrennte Zeichenfolge kann doppelte Anführungszeichen enthalten.
  • Einfache Anführungszeichen können auch in eine durch doppelte Anführungszeichen getrennte Zeichenfolge eingefügt werden.

**Wie verwende ich einfache Anführungszeichen in einfachen Anführungszeichen oder doppelte Anführungszeichen in doppelten Anführungszeichen? **Verwenden Sie zum Escape das Escape-Zeichen „\“.

var say1 = 'I\'m is ...';  	 // 在控制台的输出结果:I'm is ...
var say2 = "\"Tom\"";        // 在控制台的输出结果:"Tom"

Wenn Sie spezielle Symbole wie Newline und Tab in einer Zeichenfolge verwenden, müssen Sie auch das Escape-Zeichen „\“ verwenden.

Spezielle Charaktere Bedeutung Spezielle Charaktere Bedeutung
\' Apostroph \" Anführungszeichen
\n Wagenrücklauf und Zeilenvorschub \v Tab (Tab, horizontal)
\t Tab-Symbol \r Neue Zeile
\f Seitenwechsel \\ Backslash(\)
\b Rücktaste \0 Nullbyte
\xhh ISO-8859-1-Zeichen, dargestellt durch zwei hexadezimale Ziffern hh. „\x61“ bedeutet beispielsweise „a“ \uhhhh Unicode-Zeichen, dargestellt durch vier Hexadezimalziffern hhhh. „\u597d“ bedeutet beispielsweise „gut“
2.2.4 Leerer Typ
  • Der Nulltyp (Null) hat nur einen speziellen Nullwert.
  • Der leere Typ wird verwendet, um ein nicht vorhandenes oder ungültiges Objekt und eine ungültige Adresse darzustellen.
  • Bei JavaScript wird die Groß-/Kleinschreibung beachtet, daher stellt der Variablenwert nur dann Null dar, wenn er kleingeschrieben ist.
2.2.5 Undefinierter Typ
  • Der undefinierte Typ (Undefiniert) hat auch nur einen speziellen undefinierten Wert.
  • Der undefinierte Typ wird verwendet, wenn die deklarierte Variable nicht initialisiert wurde und der Standardwert der Variablen undefiniert ist.
  • Im Gegensatz zu null bedeutet undefiniert, dass für die Variable kein Wert festgelegt ist, während null bedeutet, dass die Variable (Objekt oder Adresse) nicht existiert oder ungültig ist.
  • Hinweis: null und undefiniert sind nicht gleich der leeren Zeichenfolge ('') oder 0.

2.3 Datentyperkennung

Warum ist eine Datentyperkennung erforderlich? Schauen wir uns zunächst das folgende Beispiel an.

var num1 = 12, num2 = '34', sum = 0;	// 声明变量并赋值
sum = num1 + num2;			            // 变量进行相加运算
console.log(sum); 			            // 输出结果:1234

Bitte analysieren und teilen Sie den Datentyp der Variablensumme mit und warum?

  • Die Variablensumme ist vom Typ Zeichen.
  • Solange einer der Operanden des Operators „+“ ein Zeichentyp ist, stellt er eine Zeichenverkettung dar.
  • Von den beiden an der Operation beteiligten Variablen ist num1 vom numerischen Typ und num2 vom zeichenartigen Typ, sodass die endgültige Summe der Ausgabevariablen die zwischen num1 und num2 verkettete Zeichenfolge ist.

Wenn daher Anforderungen an die an der Operation beteiligten Datentypen bestehen, ist eine Datentyperkennung erforderlich.

JavaScript bietet die folgenden zwei Methoden zum Erkennen von Datentypen:

Typ des Operators

Der Operator „typeof“ gibt den nicht ausgewerteten Typ des Operanden als Zeichenfolge zurück.

onsole.log(typeof num1);       	// 输出结果:number
console.log(typeof num2);       // 输出结果:string
console.log(typeof sum);       	// 输出结果:string

Wenn typeof zum Erkennen des Nulltyps verwendet wird, wird das Objekt anstelle von Null zurückgegeben.

Object.prototype.toString.call()

Da in JavaScript alles ein Objekt ist, können Sie die Erweiterungsfunktion Object.prototype.toString.call() des Objektprototyps verwenden, um Datentypen genauer zu unterscheiden.

var data = null;	// 待判断的数据
var type = 'Null';	// 数据类型,开始字母要大写,如Boolean等
// 检测数据类型的表达式,若是指定的type型,则返回true,否则返回false
Object.prototype.toString.call(data) == '[object ' + type + ']';

Der Rückgabewert von Object.prototype.toString.call(data) ist ein Zeichenergebnis in der Form „[Objektdatentyp]“. (Der Rückgabewert kann über console.log() beobachtet werden.)

2.4 Datentypkonvertierung

2.4.1 In booleschen Typ konvertieren

Wird häufig in Ausdrücken und Flusskontrollanweisungen verwendet, z. B. beim Datenvergleich und bei der bedingten Beurteilung.

Syntax: Boolean()-Funktion.

Hinweis: Die Funktion Boolean() konvertiert alle nicht leeren Zeichenfolgen und Werte ungleich Null in „true“ und wandelt leere Zeichenfolgen (''), 0, NaN, undefiniert und null in „false“ um.

// 判断用户是否有内容输入。
var con = prompt(); 
if (Boolean(con)) {
    
    
  document.write('已输入内容');
} else {
    
    
  document.write('无输入内容');
}

Analyse von Boolean(con):

  • Wenn der Benutzer auf die Schaltfläche „Abbrechen“ klickt, ist das Ergebnis falsch
  • Wenn der Benutzer nichts eingibt und auf die Schaltfläche „OK“ klickt, ist das Ergebnis falsch.
  • Der Benutzer gibt „haha“ ein und klickt auf die Schaltfläche „OK“, und das Ergebnis ist wahr.
2.4.2 In numerischen Typ konvertieren

In der tatsächlichen Entwicklung ist beim Empfangen von Daten, die von Benutzern zur Berechnung übergeben werden, häufig eine Konvertierung erforderlich, um sicherzustellen, dass alle an der Berechnung beteiligten Daten numerisch sind.

Syntax: Number()-Funktion, parseInt()-Funktion oder parseFloat()-Funktion.

// 根据用户的输入完成自动求和。
// 获取用户的输入,完成自动求和
var num1 = prompt('请输入求和的第1个数据:');   // 123
var num2 = prompt('请输入求和的第2个数据:');   // 456abc
console.log(num1 + num2);  // 123456abc
console.log(parseInt(num1) + parseInt(num2));  // 579

Es gibt gewisse Unterschiede bei der Verwendung von Funktionen, die numerische Typen konvertieren.

Zu übertragende Daten Nummer() parseInt() pressFloat()
Reine numerische Zeichenfolge Konvertieren Sie in die entsprechende Zahl Konvertieren Sie in die entsprechende Zahl Konvertieren Sie in die entsprechende Zahl
leerer String 0 NaN NaN
Eine Zeichenfolge, die mit einer Zahl beginnt NaN In Startnummer umrechnen In Startnummer umrechnen
Zeichenfolge, die mit einer Nicht-Zahl beginnt NaN NaN NaN
Null 0 NaN NaN
nicht definiert NaN NaN NaN
FALSCH 0 NaN NaN
WAHR 1 NaN NaN
  • Alle Funktionen ignorieren führende Nullen bei der Konvertierung reiner Zahlen. Beispielsweise wird die Zeichenfolge „0123“ in 123 konvertiert.

  • Die Funktion parseFloat() konvertiert Daten in Gleitkommazahlen (kann als Dezimalzahlen verstanden werden).

  • Die Funktion parseInt() lässt den Dezimalteil direkt weg, gibt den ganzzahligen Teil der Daten zurück und legt die Konvertierungsbasiszahl über den zweiten Parameter fest.

Hinweis: In der tatsächlichen Entwicklung muss auch beurteilt werden, ob das konvertierte Ergebnis NaN ist. Der Vorgang kann nur ausgeführt werden, wenn es sich nicht um NaN handelt. Zu diesem Zeitpunkt können Sie die Funktion isNaN() verwenden, um zu bestimmen, dass der angegebene Wert, wenn er undefiniert ist, NaN und {} (Objekt), true zurückgibt, andernfalls false.

2.4.3 Zeichentyp konvertieren

Syntax: String()-Funktion und toString()-Methode.

Unterschied: Die Funktion String() kann jeden Typ in einen Zeichentyp konvertieren; mit Ausnahme von null und undefiniert, die keine toString()-Methode haben, können alle anderen Datentypen die Zeichenkonvertierung abschließen.

// 根据用户的输入完成自动求和。
var num1 = num2 = num3 = 4, num4 = 26;
console.log(String(12));
console.log(num1 + num2 + num3.toString());
console.log(num4.toString(2));

Hinweis: Wenn die toString()-Methode eine Datentypkonvertierung durchführt, können Sie den Wert über Parametereinstellungen wie num4.toString(2) in eine Zeichenfolge in der angegebenen Basis konvertieren. Dies bedeutet, dass zuerst die Dezimalzahl 26 in die Binärzahl 11010 konvertiert wird und dann konvertieren Es handelt sich um Zeichendaten.

3 Ausdrücke

Ein Ausdruck kann eine Sammlung verschiedener Arten von Daten, Variablen und Operatoren sein.

Der einfachste Ausdruck kann eine Variable sein.

var x, y, z;         // 声明变量
x = 1;		         // 将表达式“1”的值赋给变量x
y = 2 + 3;	         // 将表达式“2 + 3”的值赋给变量y
z = y = x;	         // 将表达式“y = x”的值赋给变量z
console.log(z);	     // 将表达式“z”的值作为参数传给console.log()方法
console.log(x + y);  // 将表达式“x + y”的值作为参数传给console.log()方法

4 Betreiber

Bei den sogenannten Operatoren handelt es sich um Symbole, die speziell dazu dienen, das Programm anzuweisen, bestimmte Berechnungen oder logische Operationen durchzuführen.

4.1 Arithmetische Operatoren

  • Führen Sie arithmetische Operationen für numerische Variablen und Konstanten aus.
  • Es ist auch das einfachste und am häufigsten verwendete Rechenzeichen.
Operator Betrieb Beispiel Ergebnis
+ hinzufügen 5+5 10
- reduzieren 6-4 2
* nehmen 3*4 12
/ entfernen 3/2 1.5
% Fragen Sie nach Überschüssen 5%7 5
** Potenzierung 3**4 81
++ Autoinkrement (Präfix) a=2, b=++a; a=3;b=3;
++ Automatisches Inkrementieren (Post-Inkrementieren) a=2, b=a++; a=3;b=2;
Dekrement (vorne) a=2, b=–a; a=1;b=1;
Selbstdekrementierend (Post-Position) a=2, b=a–; a=1;b=2;
  • Die vier Mischoperationen folgen dem Prinzip „erst Multiplikation und Division, dann Addition und Subtraktion“.
  • Das Vorzeichen des Ergebnisses der Modulo-Operation hängt vom Vorzeichen des Moduls (der Zahl links von %) ab.
  • Vermeiden Sie die Verwendung von Dezimalzahlen für Berechnungen. Manchmal kann die Genauigkeit von JavaScript zu Abweichungen in den Ergebnissen führen.
  • „+“ und „-“ können in arithmetischen Operationen auch positive oder negative Zahlen darstellen.
  • Der Operator (++ oder –) wird vor dem Operanden platziert, und zuerst wird die Inkrementierungs- oder Dekrementierungsoperation ausgeführt, und dann werden andere Operationen ausgeführt. Wenn der Operator nach dem Operanden platziert wird, werden zuerst andere Operationen ausgeführt und dann wird die Inkrementierungs- oder Dekrementierungsoperation ausgeführt.
  • Wenn der Operator (++ oder –) an erster Stelle steht, lautet die Formel: Zuerst inkrementieren, dann den Wert zurückgeben; wenn der Operator (++ oder –) an letzter Stelle steht, wird zuerst der ursprüngliche Wert zurückgegeben und dann wird der Wert erhöht.
  • Die Inkrementierungs- und Dekrementierungsoperatoren arbeiten nur mit numerischen und booleschen Daten und behandeln boolesche Werte wahr als 1 und falsch als 0.
  • Mit Ausnahme von Additionsoperationen führen andere Operatoren entsprechende mathematische Operationen aus. Wenn Sie auf Nicht-Zahlenwerte stoßen, werden diese vor der Ausführung der Operation alle in Zahlenwerte umgewandelt. Diese Funktion kann für die implizite Zahlentypkonvertierung verwendet werden.
  • 正号和负号,两者能够进行相应的数学运算同时在遇到非number的值时会将其强制转换成number值再进行运算,此特性可用于隐式number类型转换

4.2 字符串运算符

JavaScript中,“+”操作的两个数据中只要有一个是字符型,则“+”就表示字符串运算符,用于返回两个数据拼接后的字符串。

口诀:数值相加,字符相连

var color = 'blue';
var str = 'The sky is '+color;
var tel = 110 + '120';
console.log(str);                   	// 输出结果为:The sky is blue
console.log(tel);                   	// 输出结果为:110120
console.log(typeof str, typeof tel);	// 输出结果:string string

注意:利用字符串运算符“+”的特性,可以将布尔型、整型、浮点型或为 null 的数据,与空字符串进行拼接,就会完成字符型的自动转换。

4.3 赋值运算符

赋值运算符是一个二元运算符,即它有两个操作数。它将运算符右边的值赋给左边的变量。

运算符 运算 范例 结果
= 赋值 a=3, b=2; a=3;b=2;
+= 加并赋值 a=3, b=2; a+=b; a=5;b=2;
-= 减并赋值 a=3, b=2;a-=b; a=1;b=2;
*= 乘并赋值 a=3, b=2;a*=b; a=6;b=2;
/= 除并赋值 a=3, b=2;a/=b; a=1.5;b=2;
%= 模并赋值 a=3, b=2;a%=b; a=1;b=2;
+= 连接并赋值 a=‘abc’;a+=‘def’; a=‘abcdef’;
**= 幂运算并赋值 a=2; a**= 5; a=32;
<<= 左移位赋值 a=9,b=2;a <<= b; a=36;b=2;
>>= 右移位赋值 a=-9,b=2;a >>= b; a=-3;b=2;
>>>= 无符号右移位赋值 a=-9,b=2;a >>>= b; a= 1073741821;b=2;
&= 按位与赋值 a=3,b=9;a &= b; a=1;b=9;
^= 按位异或赋值 a=3,b=9;a ^= b; a=10;b=9;
|= 按位或赋值 a=3,b=9;a |= b; a=11;b=9;

注意:

  • “=”是赋值运算符,而非数学意义上的相等的关系。
  • 一条赋值语句可以对多个变量进行赋值。
  • 赋值运算符的结合性为“从右向左”。
var a = b = c = 8;	
// 将5赋值给变量c
// 再把变量c的值赋值给变量b
// 把变量b的值赋值变量a,表达式赋值完成

var num1 = 2;
num1 += 3;	
// 等价于:
num1 = num1 + 3;

var num2 = '2';
num2 += 3;	
// 等价于:
num2 = num2 + 3;

4.4 比较运算符

用来对两个数值或变量进行比较。其结果是布尔类型的 true 或 false。

运算符 运算 范例 结果
== 等于 x == 4 false
!= 不等于 x != 4 true
=== 全等 x === 5 true
!== 不全等 x !== ‘5’ true
> 大于 x > 5 false
>= 大于或等于 x >= 5 true
< 小于 x < 5 false
<= 小于或等于 x <= 5 true

注意:

  • 不相同类型的数据进行比较时,首先会自动将其转换成相同类型的数据后再进行比较。
  • 运算符“==”和“!=”运算符在比较时,只比较值是否相等。
  • 运算符“=”与“!”要比较数值和其数据类型是否相等。

不同类型数据比较,规律如下:

类型 类型 比较方式 说明
对象型 对象型 比较是不是同一内存地址
对象型 字符型 对象先转化为字符型,再进行比较。
对象型 布尔型 两边都要先转为数值型,布尔类型false为0,true为1。对象类型先隐式调用toString方法,然后再调用Number() alert([]==false);
alert([]==0);
alert([1]==1);
alert([1]==true);
alert([2]==true);
对象型 数值型 对象类型先转为数值型,再进行比较。对象类型先隐式调用toString方法,然后再调用Number()
数值型 布尔型 布尔型先转化为数值型,布尔类型false为0,true为1,再进行比较。
数值型 字符型 字符型先转化为数值型,再进行比较。
布尔型 布尔型 两边都要先转化为数值型,再进行比较。
null undefined true
null,undefined 其他类型 false alert(nullfalse);
alert(null
0);
alert(null==‘’);

4.5 逻辑运算符

是在程序开发中用于逻辑判断的符号。其返回值类型是布尔类型。

运算符 运算 范例 结果
&& a && b a和b都为true,结果为true,否则为false
|| a || b a和b中至少有一个为true,则结果为true,否则为false
! ! a 若a为false,结果为true,否则相反
  • 逻辑运算符的结合性是从左到右。
  • 当使用“&&”连接两个表达式时,如果左边表达式的值为 false,则右边的表达式不会执行,逻辑运算结果为false。(短路)
  • 当使用“||”连接两个表达式时,如果左边表达式的值为 true,则右边的表达式不会执行,逻辑运算结果为true。(短路)
  • 逻辑运算符可针对结果为布尔值的表达式进行运算。
  • 非运算:两次取非会得到原值的布尔值,此特性可用于隐式布尔类型转换。

4.6 三元运算符

三元运算符是一种需要三个操作数的运算符,运算的结果根据给定条件决定。

语法:条件表达式 ? 表达式1 : 表达式2

  • 先求条件表达式的值。
  • 如果为true,则返回表达式1的执行结果。
  • 如果条件表达式的值为false,则返回表达式2的执行结果。

4.7 位运算符(了解)

是针对二进制数的每一位进行运算的符号。它专门针对数字0和1进行操作。

运算符 运算 范例 结果
& 按位与 a & b a和b每一位进行“与”操作后的结果
| 按位或 a | b a和b每一位进行“或”操作后的结果
~ 按位非 ~ a a的每一位进行“非”操作后的结果
^ 按位异或 a ^ b a和b每一位进行“异或”操作后的结果
<< 左移 a << b 将a左移b位,右边用0填充
>> 右移 a >> b 将a右移b位,丢弃被移出位,左边最高位用0或1填充
>>> 无符号右移 a >>>b 将a右移b位,丢弃被移出位,左边最高位用0填充

JavaScript 中位运算符仅能对数值型的数据进行运算。在对数字进行位运算之前,程序会将所有的操作数转换成二进制数,然后再逐位运算。

JavaScript 中的数都是以4字节32位表示,一个字节8位。

有符号整数使用 31 位表示整数的数值,用第 32 位表示整数的符号,0 表示正数,1 表示负数。数值范围从 -2147483648 到 2147483647。

// 按位与
//   00000000 00000000 00000000 00001111 2^3+2^2+2^1+1=8+4+2+1=15
// & 00000000 00000000 00000000 00001001 2^3+1=9
// —————————————————————————------------
//   00000000 00000000 00000000 00001001 2^3+1=9

// 按位或
//   00000000 00000000 00000000 00001111
// | 00000000 00000000 00000000 00001001
// —————————————————————————------------
//   00000000 00000000 00000000 00001111

// 按位非
// 把运算数转换成 32 位数字
// 把二进制数转换成它的二进制反码
// 把二进制数转换成浮点数
// 实质上是对数字求负,然后减 1
// ~ 00000000 00000000 00000000 00001111
// —————————————————————————------------
//   11111111 11111111 11111111 11110000 -16

// 按位异或
// 不同为 1,相同为 0
//   00000000 00000000 00000000 00001111
// ^ 00000000 00000000 00000000 00001001
// —————————————————————————------------
//   00000000 00000000 00000000 00000110 2^2+2^1=6

// 左移
//   00000000 00000000 00000000 00001001 <<2
// —————————————————————————------------
//   00000000 00000000 00000000 00100100

// 右移
//   00000000 00000000 00000000 00001001 >>2
// —————————————————————————------------
//   00000000 00000000 00000000 00000010

// 无符号右移
//   00000000 00000000 00000000 00010011 >>>2
// —————————————————————————------------
//   00000000 00000000 00000000 00000100

4.8 运算符优先级

指的是在表达式中各个运算符参与运算的先后顺序(比如:先乘除,后加减)。

表中运算符的优先级由上至下递减。

结合方向 运算符
()
. [] new(有参数,无结合性)
new(无参数)
++(后置) --(后置)
! ~ -(负数) +(正数) ++(前置) --(前置) typeof void delete
**
* / %
+ -
<< >> >>>
< <= > >= in instanceof
== != === !==
&
^
|
&&
||
?:
= += = *= /= %= <<= >>= >>>= &= ^= |=
,
  • 同一单元格的运算符具有相同的优先级。
  • 左结合方向表示同级运算符的执行顺序为从左到右。
  • 右结合方向则表示执行顺序为从右到左。
  • 补充:圆括号()优先级别最高。例如, 4 + 3 * 2的 输出结果为10,(4 + 3) * 2的输出结果为14。
console.log( 4 >= 6 || '人' != '阿凡达' && !(12 * 2 == 144) && true)	// true

var a = 3 > 5 && 2 < 7 && 3 == 4; 
console.log(a); 	//false 

var b = 3 <= 4 || 3 > 1 || 3 != 2; 
console.log(b); 	//true

var c = 2 === "2"; 
console.log(c);  	//false

var d = !c || b && a ;
console.log(d);		//true

5 流程控制

5.1 选择结构

选择结构语句需要根据给出的条件进行判断来决定执行对应的代码。

5.1.1 if 单分支语句

if 条件判断语句也被称为单分支语句,当满足某种条件时,就进行某种处理。

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

// 只有年龄大于等于18周岁,才输出已成年,否则无输出。
// if ( 判断条件 ) {
    
    
//    代码段
// }

if(age >= 18){
    
    
    console.log('已成年');
}
5.1.2 if…else 双分支语句

if…else 语句也称为双分支语句,当满足某种条件时,就进行某种处理,否则进行另一种处理。

// 判断一个学生的年龄,大于等于18岁则是成年人,否则是未成年人。
// if ( 判断条件 ) {
    
    
//     代码段1;
// } else {
    
    
//     代码段2;
// }

if (age >= 18) {
    
    
    console.log('已成年');
} else {
    
    
    console.log('未成年');
}
5.1.3 if…else if…else 多分支语句

if…else if…else 语句也称为多分支语句,可针对不同情况进行不同的处理。

// 对一个学生的考试成绩进行等级的划分,分数在90~100分为优秀,分数在80~90分为优秀为良好,分数在70~80分为中等,分数在60~70分为及格,分数小于60则为不及格。
// if (条件1)  {
    
    
// 	代码段1;
// } else if(条件2)  {
    
    
// 	    代码段2;
// }
// ...
// else if(条件n)  {
    
    
// 	    代码段n; 	
// } else {	
// 	    代码段n+1;
// }

if (score >= 90) {
    
    
    console.log('优秀');
} else if (score >= 80) {
    
    
    console.log('良好');
} else if (score >= 70) {
    
    
    console.log('中等');
} else if (score >= 60) {
    
    
    console.log('及格');
} else {
    
    
    console.log('不及格');
}

注意:“if…else if…else”语句在使用时,“else if”中间要有空格,否则程序会报语法错误。

5.1.4 switch 多分支语句

switch 语句也是多分支语句,功能与 if 系列条件语句相同,不同的是它只能针对某个表达式的值作出判断,从而决定执行哪一段代码。

特点:代码更加清晰简洁、便于阅读。

// 根据学生成绩 score 进行评比(满分为100分)。
// switch (表达式) {
    
    
//     case 值1:代码段1; break;
//     case 值2:代码段2; break;
//         ...
//     default: 代码段n;
// }

switch (parseInt(score / 10)) {
    
    
    case 10:
    case 9:
        console.log('优');
        break;
    case 8:
        console.log('良');
        break;
    case 7:
        console.log('中');
        break;
    case 6:
        console.log('及格');
        break;
    case 5:
    case 4:
    case 3:
    case 2:
    case 1:
    default:
        console.log('差');
}

5.2 循环结构

所谓循环语句就是可以实现一段代码的重复执行。

5.2.1 while 循环

while 循环语句是根据循环条件来判断是否重复执行一段代码。

// 连续输出1~100之间的数字
// while ( 循环条件 ) {
    
    
//     循环体
//     ……
// }

var num = 1;
while (num <= 100) {
    
    
    console.log(num);
    num++;
}

注意:需要注意的是,若循环条件永远为 true 时,则会出现死循环,因此在开发中应根据实际需要,在循环体中设置循环出口,即循环结束的条件。

5.2.2 do…while 循环

do…while 循环语句的功能与 while 循环语句类似,唯一的区别在于,while 是先判断条件后执行循环体,而do…while 会无条件执行一次循环体后再判断条件。

// do {
    
    
//     循环体
//     ……
// } while (循环条件);

var num = 100;
do {
    
    
    console.log(num);
    num--;
} while (num >= 1)
5.2.3 for 循环

for 循环语句是最常用的循环语句,它适合循环次数已知的情况。

var num = 1;           // 初始化表达式
while (num <= 100) {
    
       // 循环条件
    console.log(num);  // 循环体
    num++;             // 操作表达式
}

// for (初始化表达式;循环条件;操作表达式)
for (var num = 1; num <= 100; num++) {
    
    
    console.log(num);
}

for 关键字后面小括号“()”中包括了三部分内容:

  • 初始化表达式
  • 循环条件
  • 操作表达式

它们之间用“;”分隔,{}中的执行语句为循环体。

注意:for 循环语句小括号“()”内的每个表达式都可以为空,但是必须保留分号分割符。当每个表达式都为空时,表示该for 循环语句的循环条件永远满足,会进入无限循环的状态,此时如果要结束无限循环,可在 for 语句循环体中用跳转语句进行控制。

let 关键字

  • 在 ES6 中,可以通过 let 关键字声明一个块级作用域(可以理解为 {} 之间的代码)的本地变量。
  • 它与 var 关键字的区别是,let 关键字在块级作用域内不能重复定义同名的变量,且该变量仅在块级作用范围内有效。
// let关键字
for (let i = 0; i < 3; ++i) {
    
    
}
// 输出结果:i is not defined
console.log(i); 

// var关键字
for (var i = 0; i < 3; ++i) {
    
    
}
// 输出结果为:3
console.log(i);

通过 let 定义的变量相比 var 来说,有一个更加清晰的作用范围,方便了变量的维护与控制。

5.3 跳转语句

跳转语句用于实现程序执行过程中的流程跳转。

常用的跳转语句:有 break 和 continue 语句。

break 与 continue 的区别

  • break 语句可应用在 switch 和循环语句中,其作用是终止当前语句的执行,跳出 switch 选择结构或循环语句,执行后面的代码。
  • continue 语句用于结束本次循环的执行,开始下一轮循环的执行操作。

break 和 continue 语句还可跳转到指定的标签语句处,实现嵌套语句的多层次跳转。

// 定义标签
label:statement
// 使用标签
break/continue  label;

outerloop:
for (var i = 0; i < 10; i++)
{
    
    
    innerloop:
    for (var j = 0; j < 10; j++)
    {
    
    
        if (j > 3)
        {
    
    
            break;
        }
        if (i == 2)
        {
    
    
            break innerloop;
        }
        if (i == 4)
        {
    
    
            break outerloop;
        }
        document.write("i=" + i + " j=" + j + "");
    }
}
  • label 表示标签的名称,如 start、end 等任意合法的标识符。
  • statement 表示具体执行的语句,如 if、while、变量的声明等。
  • 标签语句必须在使用之前定义,否则会出现找不到标签的情况。

6 练习作业

  • 根据平均分来划分等级

    • 得到小明同学的各科平均成绩,如果大于等于90为优秀,小于90大于等于80为良好,小于80大于等于70为一般,小于70大于等于60为较差,小于60为很差
  • 加油优惠价格计算

    • 加油站实行多加多优惠政策,鼓励车主多加油
    • 已知92号汽油,每升7.15元;如果大于等于20升,那么每升7.1
    • 已知95号汽油,每升7.63元;如果大于等于40升,那么每升7.6
    • 编写JS程序,用户输入自己的汽油编号,然后输入自己加多少升,弹出价格。
  • 输出100以内的所有质数

  • 判断一个数是否是素数(素数也叫作质数)

  • 输入圆的半径计算面积和周长

  • 三元运算符比较最大值

  • while实现1-100相加求和

  • while do…while验证用户名和密码

  • 打印菱形、三角形

  • 输出【100-999】中的水仙花数

    • 水仙花数是指一个3位数,它的每个位上的数字的3次幂之和等于它本身,例如:13+53+3^3=153。
  • 打印金字塔

  • 九九乘法表

    image-20220103232309923
  • 一百个和尚分一百个馒头,大和尚一人分三个,小和尚三人分一个,正好分完。问大、小和尚各几人?

  • 公鸡一个五块钱,母鸡一个三块钱,小鸡三个一块钱,现在要用一百块钱买一百只鸡,问公鸡、母鸡、小鸡各多少只?

          break outerloop;
      }
      document.write("i=" + i + " j=" + j + "");
    

    }
    }


- label 表示标签的名称,如 start、end 等任意合法的标识符。
- statement 表示具体执行的语句,如 if、while、变量的声明等。
- 标签语句必须在使用之前定义,否则会出现找不到标签的情况。



## 6 练习作业

- 根据平均分来划分等级
	- 得到小明同学的各科平均成绩,如果大于等于90为优秀,小于90大于等于80为良好,小于80大于等于70为一般,小于70大于等于60为较差,小于60为很差
- 加油优惠价格计算
	- 加油站实行多加多优惠政策,鼓励车主多加油
	- 已知92号汽油,每升7.15元;如果大于等于20升,那么每升7.1
	- 已知95号汽油,每升7.63元;如果大于等于40升,那么每升7.6
	- 编写JS程序,用户输入自己的汽油编号,然后输入自己加多少升,弹出价格。
- 输出100以内的所有质数
- 判断一个数是否是素数(素数也叫作质数)
- 输入圆的半径计算面积和周长
- 三元运算符比较最大值
- while实现1-100相加求和
- while do...while验证用户名和密码
- 打印菱形、三角形

- 输出【100-999】中的水仙花数
	- 水仙花数是指一个3位数,它的每个位上的数字的3次幂之和等于它本身,例如:1^3+5^3+3^3=153。

- 打印金字塔

[外链图片转存中...(img-TiSa8RbT-1695633510590)]

- 九九乘法表

  <img src="https://img-home.csdnimg.cn/images/20230724024159.png?origin_url=https%3A%2F%2Fgitee.com%2Frawait%2Frwpicgo%2Fraw%2Fmaster%2Fteaching%2F2022-01-03%2F202201032323026.png&pos_id=img-rQ8QhapN-1695633577683)" alt="image-20220103232309923" />

- 一百个和尚分一百个馒头,大和尚一人分三个,小和尚三人分一个,正好分完。问大、小和尚各几人?

- 公鸡一个五块钱,母鸡一个三块钱,小鸡三个一块钱,现在要用一百块钱买一百只鸡,问公鸡、母鸡、小鸡各多少只?

- 红白球共25个,白黑球共31个,红黑球共28个,求三种球各有多少?求红白黑球的个数

Ich denke du magst

Origin blog.csdn.net/zhangchen124/article/details/133277087
Empfohlen
Rangfolge