10.json Objekterweiterung
1. JSON.stringify (obj / arr)
js Objekt (Array) wird in json Objekt (Array) konvertiert.
2. JSON.parse (obj / arr)
json Objekt (Array) wird in js Objekt (Array) konvertiert.
var obj = {
username:'bar'};
obj=JSON.stringify(obj);
console.log(typeof obj);
obj=JSON.parse(obj);
console.log(typeof obj);
11.Versprechen
Asynchron: Es gibt keine Beziehung zwischen Operationen und es werden mehrere Operationen heraufgestuft (der Code ist komplizierter).
Synchron: Es kann nur eine Sache gleichzeitig ausgeführt werden (der Code ist einfach).
Allgemeine Syntax für asynchrone Operationen
1. Ereignisüberwachung
document.getElementById('#start').addEventListener('click', start, false);
function start() {
// 响应事件，进行相应的操作
}
// jquery on 监听
$('#start').on('click', start)
2. Rückruf
// 比较常见的有ajax
$.ajax('http://www.wyunfei.com/', {
success (res) {
// 这里可以监听res返回的数据做回调逻辑的处理
}
})
// 或者在页面加载完毕后回调
$(function() {
// 页面结构加载完成，做回调逻辑处理
})
Promise ist eine Lösung für die asynchrone Programmierung. Tatsächlich ist es ein Konstruktor. Es verfügt über alle Methoden, lehnt ab und löst Methoden auf. Der Prototyp verfügt über Methoden wie then und catch.
(1) Der Zustand des Objekts wird von der Außenwelt nicht beeinflusst. Das Promise-Objekt stellt eine asynchrone Operation dar und hat drei Status: ausstehend (in Bearbeitung), erfüllt (erfolgreich) und abgelehnt (fehlgeschlagen). Nur das Ergebnis der asynchronen Operation kann den aktuellen Status bestimmen, und keine andere Operation kann diesen Status ändern. Dies ist auch der Ursprung des Namens Promise, was auf Englisch "Versprechen" bedeutet, was bedeutet, dass andere Mittel nicht geändert werden können.
(2) Sobald sich der Zustand ändert, ändert er sich nicht mehr und dieses Ergebnis kann jederzeit erhalten werden. Es gibt nur zwei Möglichkeiten, wie sich der Status des Promise-Objekts ändern kann: von ausstehend zu erfüllt und von ausstehend zu abgelehnt. Solange diese beiden Situationen auftreten, wird der Status eingefroren und ändert sich nicht mehr. Dieses Ergebnis wird immer beibehalten. Zu diesem Zeitpunkt wird es als gelöst (finalisiert) bezeichnet. Wenn die Änderung eingetreten ist und Sie dem Promise-Objekt eine Rückruffunktion hinzufügen, erhalten Sie dieses Ergebnis sofort. Dies unterscheidet sich grundlegend von einem Ereignis. Das Merkmal eines Ereignisses ist, dass Sie es anhören können, wenn Sie es verpassen, und keine Ergebnisse erhalten.
new Promise(
function (resolve, reject) {
// 一段耗时的异步操作
resolve('成功') // 数据处理完成
// reject('失败') // 数据处理出错
}
).then(
(res) => {
console.log(res)}, // 成功
(err) => {
console.log(err)} // 失败
)
12.Symbol
Symbol ist der siebte Datentyp wie JavaScript. Es ist ein Datentyp ähnlich einer Zeichenfolge.
1. Der Wert ist eindeutig und wird zur Lösung des Problems von Namenskonflikten verwendet.
2. Der Wert kann nicht mit anderen Daten berechnet werden.
3. Das Definitionsobjekt kann nicht verwendet werden. for ... in Schleifen, aber Sie können Reflect.ownkeys verwenden, um alle Schlüssel des Objekts abzurufen
let s=Symbol();
//console.log(s,typeof s);
let s2=Symbol('七七');
let s3=Symbol('七七');
//Symbol.for创建
let s4=Symbol.for('七七');
let s5=Symbol.for('七七');
console.log(s2==s3);//false
console.log(s4==s5);//true
let result=s+100;(X)
Datentyp: undefiniert, Zeichenfolge, Symbol, Objekt, Null, Zahl, Boolescher Wert
Fügen Sie dem Objekt eine Methode hinzu
// 向对象中添加up、down
let game = {
name: '一款游戏',
up() {
console.log('我是原来的up')
},
down() {
console.log('我是原来的down')
}
}
// 声明一个对象
let methods = {
up: Symbol(),
down: Symbol()
}
game[methods.up] = function () {
console.log('upupup')
}
game[methods.down] = function () {
console.log('downdowndown')
}
// 调用
game[methods.down]()
// 第二种用Symbol作为属性名的方法
let game2 = {
name: '狼人杀',
[Symbol('say')]: function () {
console.log('请发言')
},
[Symbol('zibao')]: function () {
console.log('狼人已自爆')
}
}
for (const key in game2) {
console.log(key)
} // name
console.log(Reflect.ownKeys(game2)) // ["name", Symbol(say), Symbol(zibao)]
game2[Reflect.ownKeys(game2)[1]]() // 请发言
13. Iterator
Durchlaufen der Kartenstruktur
Jedes Objekt, das mit der Iterator-Schnittstelle bereitgestellt wird, kann mit einer for ... of-Schleife durchlaufen werden. Die Map-Struktur unterstützt nativ die Iterator-Schnittstelle, und es ist sehr praktisch, den Schlüsselnamen und den Schlüsselwert bei der Dekonstruktion und Zuweisung von Variablen abzurufen.
var map = new Map();
map.set('first', 'hello');
map.set('second', 'world');
for (let [key, value] of map) {
console.log(key + " is " + value);
}
// first is hello
// second is world
14. Generator
Der Unterschied zwischen Generator und Funktion besteht darin, dass der Generator durch die Funktion definiert wird (beachten Sie die zusätzliche Zahl). Zusätzlich zur return-Anweisung können Sie Yield verwenden, um mehrere Male zurückzugeben.
Die Funktion der Fibonacci-Sequenz kann nur einmal zurückgegeben werden, daher muss ein Array zurückgegeben werden.
function fib(max) {
var
t,
a = 0,
b = 1,
arr = [0, 1];
while (arr.length < max) {
[a, b] = [b, a + b];
arr.push(b);
}
return arr;
}
// 测试:
fib(5); // [0, 1, 1, 2, 3]
fib(10); // [0, 1, 1, 2, 3, 5, 8, 13, 21, 34]
Generator verwenden
function* fib(max) {
var
t,
a = 0,
b = 1,
n = 0;
while (n < max) {
yield a;
[a, b] = [b, a + b];
n ++;
}
return;
}
fib(5);
//用for ... of
for (var x of fib(10)) {
console.log(x); // 依次输出0, 1, 1, 2, 3, ...
}
Vereinfachen Sie den Ajax-Code
try {
r1 = yield ajax('http://url-1', data1);
r2 = yield ajax('http://url-2', data2);
r3 = yield ajax('http://url-3', data3);
success(r3);
}
catch (err) {
handle(err);
}
//异步，后续学习需要深入理解