变量声明
let
和 const
是 JavaScript 中变量声明的两个相对较新的概念。正如我们前面提到的、let
在某些方面与 var
相似,但允许用户避开一些用户在 JavaScript 中遇到的常见 "gotchas"。
const
是 let
的增强,因为它防止重新分配给变量。
由于 TypeScript 是 JavaScript 的扩展,该语言自然支持 let
和 const
。在这里,我们将详细说明这些新声明以及为什么它们比 var
更可取。
如果您曾临时使用过 JavaScript,那么下一部分可能是刷新记忆的好方法。如果您非常熟悉 JavaScript 中 var
声明的所有怪癖,您可能会发现更容易跳过。
var 声明
传统上,在 JavaScript 中声明变量总是使用 var
关键字。
var a = 10;
OOwaCZM0hDI78fqwaIG4CsvWASKTkMnXmW3wNWoRVhoPy+uFOQPBZZOYE9x/jtV67mqndkEOSPdGugNWtV7lLsUWgV1uWLBWkpSh6GarCwLWGPZR6qyyuJElMeECHM8Fp+/Rkp6EkGSCttKeV1M5njExDsIgew3C8L22NBbFVp8=
FjkzzHpbA+0vMpZYxNAjDnWIfWg9t0JjVnI+SVmXFjcxB6zGloJnuJC7BDQoUG6VzcIpkGNRMDAkDzDtc0ULiw==
function f() {
var message = "Hello, world!";
return message;
}
FjkzzHpbA+0vMpZYxNAjDuWJo6Uu9SdiJkasqLvB4wnTZEq0Biq3OZr4f5ClMzghP9dMmdr1fKbkkr+9hdL7tg==
function f() {
var a = 10;
return function g() {
var b = a + 1;
return b;
};
}
var g = f();
g(); // returns '11'
ZpLnxNo6hkAmeBh93H7JrgvsCln/WMzdUOMuCVE7T5GVMX6gHYGk2/xM5Pb0gJDQ6shVO623olI3qGCZ6Nn8/oWZQYV0l12LYVnfjWfhB0TMb2YL/Q7JvbZHiSQi0MAnmI0Vr17kG2cQ+qiBOGC3MfSKM6ldrIPuPPNlbBA+K71ZGCEVrHSklOQcKM41sK5ixWszEcw8spzgHEv+yweV9ObEnVocvmAOst80/TUoSmwxVTq0shC2VC+mYQKA9RNA24fDWhIcRY+/+x6xND7aQH2N6JlPx3yO2XiKlNefEFBF980M7pVcPzAWNvX9yrO9AgO1YXOCSIaEZGDntb8yXny74gkPMT3rVehmRo2WDgYb/8tyM4+Q1mcJcmgAwvYSSwSLdwlZDpf5EF4YliP5nhAKqeD2xKoonbXOIOZIfb9b5xmUiGoK3Rat41klqWYd
function f() {
var a = 1;
a = 2;
var b = g();
a = 3;
return b;
function g() {
return a;
}
}
f(); // returns '2'
作用域规则
qtHUdBefUyoXsBZFiZXSFjqoYBNfxfQbqhVG+EDAEHvG/7jG3pks8tWX7g//RvINlNLe03wunah8YxIms2v2nG9fQ5neTxHDOBuiGiz/IGvRhbqzUU9HnxFCMz5mWEIVg3x57iXdq3yAn/Geq0SurVEAyp9GefVs5ovf45fpr98=
function f(shouldInitialize: boolean) {
if (shouldInitialize) {
var x = 10;
}
return x;
}
f(true); // returns '10'
f(false); // returns 'undefined'
qPW09fVLhiBg/mB0IosS3mw2CRwKzKCz2r2oezp2+W+RuRxI7bWT9eb1xsOSt/OlZUdE87EPc1XS8ZYuuzuwDgf0Om7uSLR21DBaddZL8yQ5gF6ouGs2t59/RTBofC5JYuUwVfPzbppiGSIkcsvZrozTjCGR8ptBMSA1XK54VqBv10Gykt68vgoyxUekQT6n999ZXTOvIPqqJxskLSvXg8LF0wzRcCBswR3v6qPOCYJ4uvi41Z2MqjZx0qG4VdTq5GgMSrYjFbR0hc/WVEtLnnJ+/xoNUrilALU5uWXO9jr7GIaOZp/YaacVTSMwsy6Ve4fUK58O9kNWE/DesDUiIMPKpuL0UTRGuZIEFJFA0I0K3Y7zzKWWtxR1lPpgratKfig5P6ehNEcxTBA+mxTI83+uUpphF/l0Bzm06pfsuOghI4NIf5UUsoQzf9EZNV4TVJhNbat2jETlo4IMmzrx/we7TLD+hLykTiHPqgEnj3jmAjwqfOgPueewqNBgfWLA2UiaFLBlBL+sMhCQiuNQtZgH7H34k1h3ofIJcVUki+OZBBkPlnU+IytGERTGPl9oW6qeUiXyib+djgtISZMzf/S96r4lckvY6BSqUTlKpUg=
bmolkNyxPHCkPERJAuQbpqTy21jV/cZU6Vp4L1PeoBxR99eMi2t3BKOErZP+J3euPcsDLQU8H3Yr2Pp/Jljq1gt+sMe4qLa6iCBzuCOW1jE867gFXEeHxNtNsXhJkxloMgMjzqdyZ58XEtjmGKosVGMA2PIEA5/8El68C1ZqM1iy92RX/hmVVIwYniXmc37aIhekV1qGHgRubOGSOeN4dw==
function sumMatrix(matrix: number[][]) {
var sum = 0;
for (var i = 0; i < matrix.length; i++) {
var currentRow = matrix[i];
for (var i = 0; i < currentRow.length; i++) {
sum += currentRow[i];
}
}
return sum;
}
FHHJCisv/ZcF9yFapVCWDJy0pYMU0yCT6l7/B9ATmJMVLhY6/1XUwODGuLamfFZyBJN6n633YphtujBInNxQQW5qh4g6CJFzV2m05WiPCMyY4nrieUT39yGS7Gpya8ju3HvO1+kpH6nllt0IFpy0Blk7qBaAXC4YqVdy9EfspdWk4Uv9/Vs9QBBhCUrbYZeLme2uSoKjpySHEOgkxZ6bImLAhskmqkYOf/UbCt4F4mzNZXEbi5ZfJMfAin/rK/agpBBUwJP5stkdJKi5yGdWj9bnafNcR7hH3765tS5BjePOKJlvZ038lfe0jRd8mZ+fdoRLhSejdldm7UnNqFrHjuMm5rXRcl4GfSZZm5oP+635JD3y2UFfQ5qduPR+qJwNz0b99UUIm2ly705LI4qx4gvCwSaSBALE61H/bEpqA3TRXgYKYT1jZi+l2YNgeVyMcgRCgkNUq6vDAVPFOFmFCGnKL8Mf0510+BQ9kmyAFnVc9tyZ2HP0dWt6gRFF0rUO
变量获取杂项
/Y0uwQ+JRK5gtwMe/iJ59ueYyttV8HnO4MORHK7K2J/RMzTcpDbiMgP/ZN9wUtsMCXcN3l0clzSMmHssxnD+Ig==
for (var i = 0; i < 10; i++) {
setTimeout(function () {
console.log(i);
}, 100 * i);
}
Ol9MFNPNPF7CSNtzke677RSMFUjKLigvciIp4BUcxiqShn1FYJ8wqEZfLKUJyIS2cDASsvODGzilp1KGjgCBZwQU4J5zrtX947MhzVMA5/seIJCtQQN62Bfoup1FEAssQmL65ayKrWE+RYTIz5m6zEi1hTeGSA6KWTFI1m7M4Uxl+1umo//cDVPNzGm2FJ9WdhBhqnagYAZMEjFaZkfwww==
ho4LL79geZVOm7yzE9tQEiitDM6SYtGLsaRezeWdlvA=
10
10
10
10
10
10
10
10
10
10
woxpik8a82NRNXAtRnBZoLrrw12y0xfwx3mJxA8V7zzWm4QGE4dDHuePRCeFngAeKnXV1pNkLYk5fXgvJBSFlsr1qj/KKMce4jcEnDBMNsDVAh2r784bih/UXe4xH7KE+a9EYOu9KGg6idBMuQB/35Im2lxB0N+SkrRCLiHkJfH7lRe7PyyKDg7eO2tsgKuikQP+q+y+4k0Bnid4Ls4LAg==
0
1
2
3
4
5
6
7
8
9
S6iJ5aIoXNBefBWUUeB5fwFuSQ/RpayDSFLvFQ79Vt57a8fbGhSlgTm80msbwRUCdZ4Z+kAvBpLxGlpfMQ3AwCR2NkkdaQRs1KG2VUBRVfm1aY702btqFSZmZp4RRO47B7P6v/3xs7HlA/iCcUGjB09eb2xqvdglwRkG9l9IC+OpZZsgb0Dgf5y+R3P1NekBz7mDadHZJBBjwgvnIXyBC1cIj0OG7em2/HZ24OOWIa5gwEZ0JFUD4GGGdxozKlbWHeL/yNCQ0Lk6NKKE1Casjw==
BjoONziJgJJqPGSM1rJNRvIEey9RHPhjytERnopwP/Caak558Zvg0LYZeOFS4F8aL5wqKCxVfIOE1sajYauq8BCJwSxZVQ9J+U91710ZwY9pPHKBsYL3hMTiI+FMSNHu1zLdOtB8248xMm07hqPKk6batHE/UqL2nUeffqV7e++FPy06A4kfEtT9ZoOlnrCwGp35mxhIShcCrQGQYBE51rH518ukU5zREjC+MDAmplH60vKJQTVwv7Kmo9uWhRm+63UAGYbUKTIWC3MVE1H97FBKuYBMwCbjM5eLJ13b2R+OncbezlEVjm2KjX8TOuNBRj9pDBPwhGQ4lb5ySpqaO9y7ZHOOtJX+DcL6adEjM0+jJJzVdGXpfPfgk5A3XNopToFp41vrOU+oBZFXaR4fBkoP67G6zmgbtZgM0zhFILBnF+5rxH/AhQ5jqPHACukaSFXX+oI8ubwJGZkQeVk/CA==
CoT5ivxYNb1VcNmItAqY2gUkgKFJnhUQBoxo2R/UsLnJ64od1xAE+lzL54RG4MTRlQnd9IYSt6CdO2Ys3x7P5+fhWcmMeUz3f0guAtiZ/7IKQRmDONZpfzOhyUZQicuoSTP0E8dSNnv6bgyA911AIWcUbR+ZZw7aOWM/3mdTx0E=
for (var i = 0; i < 10; i++) {
// capture the current state of 'i'
// by invoking a function with its current value
(function (i) {
setTimeout(function () {
console.log(i);
}, 100 * i);
})(i);
}
VYIhKpOOMtc5kqr6zN7KOEyMSH/2W5ackIo52Y3L29QsWktO8NCgq9I4l6sxGrmaQKDRCoNUb24I93WcOdJ57GFhaSZBNj01fNlRig13rvqaWAtEg+OBQLW7HvOEZtdM5w/iXBcaoKYdWqmoa7LATWvPsETs4Wl7x2sfruTg9vGROTzTaw/L2C9LJq/h9zJB6y6iUx+REizhCkBD3FW6jbphAzHQwKriaAsxqKAkFWe+QXKMoMyG6V1IHlrS5n7P11bmzHq030aiAuTGws7v6bFA1Y7m+vO0cNEMAAWhmAsi9cjDaUjl3MtxPN72DidDyJCl/7XpHHPO5zZlEJSxgQ==
let 声明
ELlAIaM6vw66hjvTrOnU3OgVTf5f6fbwj1jQ96j6eRI4+Gt24VUiFGG4DMcSzsjuiIbIlUB/e73Z5v85+8brvaS6OHbIPGw8231cHRM6PH07rCW2YNgDhLpBwNmUbTVNoTR2CpVMoGMa1PKDc8d+dIMn8j8Uh8yttG5WFAVDRibOLh283+yRV2RJaS2eNr8pCIfdYdCJ58dm38BRbvBLrGSvOzdc9RGSr/eD9gX9K+GYRCC9I73e6tFH+4U8TnA22HbdmF8Qz5OK0hmQLeqTbJNdQVYY/mZJSaHsBlot19c=
let hello = "Hello!";
Yq6BPmATk0brVSkVs2xbpzYpIe5wrSC+VzoGjT2riC76d/yHQ+/gQM3/+zb9ZfdIPZwklSqLLgWcqKZcgybpywb09mQ60fsFxWwj5yRfLoVT52buS0vg/iUjwvwqEeu3
块作用域
gInnTkKJVU35w3yYnE/FFPxxaqM4g0UXuC4eIlO1e70sz+seK2UGT0yqPPlGJm32yOtKtYS8PlYLIbnqZt+50KsPtd8CSaqVfQJ9A8HybvZ0c45uDJIcZmExNDs3ohOaIEqpJ+PEhs6dAvMtNs3T5obLzYraufXq4deRb6emhOs92oEfcAkUaMSx6spahFIPZl1EvXPWlmLxsbAQtjz+IhZVwt5vKlePRzfNPVOLzur6Bl7+skmXhDuLuEf8bwUxO1nAhtOlPgRPgcEVW4FIlz2V9nwVQxnd5hk4aUlTOV4ik10erMcMTmAa+DelOEyzaa0JxucFwi7Y8xhQnyPOvdwQL0Cd2SxBEdkDwVgu0GbEKbvLdWl9+czgRJo12Lz+
function f(input: boolean) {
let a = 100;
if (input) {
// Still okay to reference 'a'
let b = a + 1;
return b;
}
// Error: 'b' doesn't exist here
return b;
}
atxJ8LPPvF4j5bKGI6khyhVJuBneQMXSk/3n7XU0b8fOXf/gP0hWykpJse1dKFkAS9V51+iIk8TICb3UIs4N9a5mzQbLpm1MD39ncg2ZVE8AMHlHrHE/DCid+Tv/3PRZo1VAX/NfVb5M1Gsov59rELWVWo+2FdzMwQCfnyHKKIMJOyWhJub4JStjlPfq35zbKFQ+Mv7wW2rR35D77cNG6B9KWHOeuQwfV38L2RA5WL35sVOKlvkeBdbdw/IDUURnyCTS4lwB6UjXnE0S329hqQfQ1fMel0QvuRUVPUrbBjQ=
rEXg6PNuf4FBw7RwrjI7C+YBgHF4syDn9HAQDvD1um87uRFhNfTu4C5bbjJ5PlCL1DLoHJC5OcRiEpBQBM9osC2dan7knkRlffKfUUB3qsIDnXUU3BlxpOu4WRgu1h4j
try {
throw "oh no!";
} catch (e) {
console.log("Oh well.");
}
// Error: 'e' doesn't exist here
console.log(e);
CCjIhuEtmQNjfd0hrAy9yf3KUZGWboidyNQYVGaLEurzwnLOM8ZcnIyNT4r3zHMomk2yZRG8Iw/L+Q3lmptZcX0k4ywC8mGjTYqG0+Pdueh8dUTWCTImt1XfhFw6+cy/+gXOk1nVHz/OlSj6TDSSGibdpiVYSvVPLiRm64pcTIsBWt2il9+z2vndUUUPKXOmDbja0wYzw2cpUahFLFFsMyZWZ9Y9XpJPPDLqDCuchn/JBBKFae42Erz/oy349nvwhPD6VRXkODbYI2mnsIQHx5lsD8E46WyoHwFQo2seqSpsaAGkkoryK03Edrfxc5cJogNEVJ5+rTERDbDExO/uQux9Q9plbZcSdjDh0ltujnVxG9hy+4PwXxhCn1YCc6JrXBnWjNiKzsKDtKYpbjBrIoJtLn8/Cd3Q52wTZtMcWNnHph4j/dhSpceb27/vMSoVScd3KC+moKAxg7JiJ4PANcpaPjHeeNc1Xq4Y5l8qvpw3BhqmZ3qCmb4jxn8VYZii
a++; // illegal to use 'a' before it's declared;
let a;
UOx1h8d75hga6vSZJOKyS6CQOkkrzBfRJskleewMhlNc8sMc1BohFRvSpHsJRayKh4Xv8pLqfzi/V1ZE8HyfQmZFn+iaZya5M/fyu8Ax2rCsenXcUf9RDwhTXav/dP+AS644MmmHo76Bq9TovPC7ideN8LziZgbSKm0bNuDVzYzEKr1IuCp5xeHGXvQGrqNTv9HhOhX0RWjWAKIsHcuK9JDIRwIOcuAOUUz4eqce+wdrOEliLZ/XeyZm4PYOU+6cCgcQv0QnD9GLKyxAltcQZI8EZx5tCZdEf88LHyS/WgBRB/dgz1HTi/qILtxhxtIob0ekZcuqj8wr/2yt5iDJgkfRjCNXvhgVpnzT838KhzWOkZd2z9W1lQpbWdXexOos
function foo() {
// okay to capture 'a'
return a;
}
// illegal call 'foo' before 'a' is declared
// runtimes should throw an error here
foo();
let a;
3elpcUFdlyiVG4TJBMLaXDPKPHM2VQ11WXXvArlHuwmhhDqXlVbMpVabGESE4xonMy/UIlI7Uc6t/B4wBrWRyrmisruscbuZ9bpqQ417TbWUwpAKi9IDEN4UeBYzYa+1QrI332IGAxNFn4fO9Cle6t2Zq4w+PS0IC24RvitD4FV7EqYdHPvlMf2aHblpSBXS
重新声明和阴影
Ek8T7FtSn9axT7/ieMDXnvvLwFxhxsHQhNmDNhKdA75A+PiLLisDyzXAFnUG8anPk+2cL5N/nJi2tfVL45+2PPbyqMkTRd7hohYPoUIRCpu8rzilEayB0u+3iflbJhDjGwCk7Dqaya4gGGCg5vPyCw==
function f(x) {
var x;
var x;
if (true) {
var x;
}
}
A8tdkrUHlsnRkFX4A1/673Yxt+yA1J5j+6NSExmjKR3DJ9bAyrZ1Zj5qTeXdHUUf7gPQJ/0DB72+BiPlozZqkTKro+bEtr0kw/MyWWaq+kxJ1fpGDKOgMXC08CN4fx6eCWzKMrPw2elkSdI06PaR5Z0gcGJEJCqlvgouAciIe2BE7/hHk8YFN0aveWH4+0LHfmh2DrQ03d1xVddx9yZvQwQsge7wLgByR5PpEPic+hZJsoZHTqif0ng81NSfNOdFttoukfmu4aTAQIUYi6Ugd/6ixtzhcD7/3Xsvc7MgZBg5VBBb7olCJ34vcWx+nmBQ
let x = 10;
let x = 20; // error: can't re-declare 'x' in the same scope
GaayYP1wVS7uDRdKpwRDmTGczwL65LhERf2ytW00uXA0jB3mjMH6/obSTyWaLCbJpSXPBWW3chWVtQtVO8BMQHeXedL8vqsjF8m/FBl+G6iO9yg2bS4B3Nz03sV5zLzNQfPEyeYD6q4XptjlTxVp1A==
function f(x) {
let x = 100; // error: interferes with parameter declaration
}
function g() {
let x = 100;
var x = 100; // error: can't have both declarations of 'x'
}
3rJP0e2SqvGyi6rIrtAdkj4IRYhYUiMgTbt932b943hLPLkKJpX2lisaKXyVK/Gax3etrm/m0l42pyLrXx0oICxur2tLPbB7+WqH9f9ObWT5XLkyBlEQTgZF3h+EE01vtlI3tFVMUGhgP/0blhF0tWBjWyj3OXogljfm5JGfOKkWkvU5hUtSQx03CoSS29UtJrDiPRivGpHAtQDGUV20+A==
function f(condition, x) {
if (condition) {
let x = 100;
return x;
}
return x;
}
f(false, 0); // returns '0'
f(true, 0); // returns '100'
o/jCDb9zBKcCluL/NMF93aZ3arT1XLZbATBvmhDmx2ZbNHArj2yajcXMVaEegfsyXwwTyGVUx8B0vfQyrEg1nIwih7wtdZZrL4FK2+rJC5g4hIM846XZND1Dd0t69guL8aurc66G+4fgWiamrDeoP6ZitxMJdnbzSJq6LEJ2IQpAYjHaZOewGV8b59xr4AaFZJKGTYoWNhzkbUHBvwSjZIgwxFYzrTcE2wq3qZz/Gc/7KGtdXTsMYJGYN0w7BksJXFS8mq0gsp+z0oPe4slv7iz0Mv4zjdtvlnqxfZY1cxws6ohH6FoemCqj92ONtaCLQZ6jtnIDTw44qWdIKaKwLBBka6xmloZm5O394c0S4wpmseNpIKlHRohdBHEfdjSqtbS4eIII7WcGrSfV5a3Cwg==
function sumMatrix(matrix: number[][]) {
let sum = 0;
for (let i = 0; i < matrix.length; i++) {
var currentRow = matrix[i];
for (let i = 0; i < currentRow.length; i++) {
sum += currentRow[i];
}
}
return sum;
}
1fmV7/OgKtReWa2cJFbgu6RhJqKmrVKMiWoSrHzHsgvOHtUDHcIdrW/X61ys0BPdXJmLxOrZXiRrOZDcuu5m+ksm3PqIChOXNw0L55eJX2djSpq6r3KXkf0gQZUoXxkccxiTBxrSz0T5wSTjYi97DJ9am5uhfoUTHVTRFk7NhPLUeer3mSHmT4SSVlEfqW1k
XdGBouJRHELXIsrzxHScoS6xm864SScwy2eCCWE5YWWXoDEmkdlXvtG5z2pS/V6dF5sB/8MyZcv6br/BO1otjWCZrL7DiC0SAXR5pCdH8D28TDsZaMW3gMh4yP5p2ZHlIOesTn8It9FLMsqKsGGVgYBLR/Im8h/9di5IambwXPtdOLTo2KuU5pE8gO6q/FTH
块作用域的变量捕获
ybT44eLLh62jaGkv9ZDr2pnSfuP6n3taOjDduf1Sxds0vebTsSmJZoIImMh1+8jcLOBCESPoCLIbEGxupDB4+z+dljygUpd8zkORv1XRZmZOM7l10ERIpLQ0Xaxbiiy2wuccjVOzezRLEyQFIFGUBujFofHRAatRErGzlDP33Dwp2Vd9n34M2/7E80Y/tTgo+6APDDUizZOCrlYmJTXDb6ir34sTQTNCgSIhlGBsU0wjv6cpst2j7zw7UO2r45iaStvldUSebMBEAozoVSfqIYCUWkBHP8YzwZ53cXhUu5glqaCb16dMm8Gi+rs8nDKhXsElRYTFzF6t+CPENt4EbxyWJqcIn5NjcG9X3XADSIs7KrbrEKIVPqaBiHBndOCu5g8WA2MoGYf3r7AOkHmjmPlWaymJnXBTcTZ2Ktu4ZNyG27eyIabrAWtDYG4msDLIQhY6k8GbdAYo5C7EXFiiDDbtk5Rf6ca7Jbudit4r0w8=
function theCityThatAlwaysSleeps() {
let getCity;
if (true) {
let city = "Seattle";
getCity = function () {
return city;
};
}
return getCity();
}
qZu4Rw8vL7qIxHJMmlBd6mBoJ28ipBnUQvX6+u8LvyYLg7LddA3adXhf/aMdVzN+ydPpEoOJ7+Vleup1QmhmtE3iRK2c37ll7hFn0BCMfW2sihEopGnaQj0N6H8JYxW34iVAIMo+DqUJcfF2kWfd8kDmro4r8QoI96DIEtMKPrTn8j1WE6G3WMZ2miENOqND
hMhZH2oU92i9RBid/72IaN+Jdhg6AwSqgzyewYJAXmP8+cAulX/S1EoemWRQc+aMzmWZ2tONgNpzTrxbrmp8dvBpRBef7RAzeqI6yKHTML0WerAkRayRG9kot65j+DTzCyH6GLuAhFIjhdJJ0tztKUMAU3knkHCWoPvccjcDmGjPKu1WH3T9kswywD0S709GWusV6h/Bp5jM55kkSnM7l5NUK+/MME5zTyjDxlUrz7G9llB3v8wlT2vjqOSLi8NLOghna1anCPK+Kt8lY02rgWMMjVU62Thy5iJEvt/t150BILtxctQboswdB0IpcTvpvFLQXI/m/zfwC31acri/t63Sh0kAWZI86+bOfk7xgryeLLOeoqQ/akehj39fXjlW0f1I/r1MS5QvtN/JCfYQ4RPgpAbcIpHkjtwWDPQh0Hf0PboL1iI+HMIqM/Nu9BIa
Ij7me/qcD7owTDkLmLWFEKftGdT7Th1RO1ZBg6UotIfoU4ESgVAGAfrouML+tpPqCguNXnbAudiHsj9UlwxmzgHrJ4AbR2Vi65EaDU57UPZ8xl1A8Cf28qElU7iOSkSgVFBaLGpeIABsrU3Qg3hh47mf6CL53PpfY1h1/E1zHIYfl5AlwHY428f4FAeWe2Efg6I2T0eTyIfRJP/sPc4LWiGYErYAW3HiC3V+TadgoCnoxhcHOeK+Wnz7F/Tr1aWrqlp4LEM30JoUdmmcpYOVQqJQxNly8xvXPN1s/0wwuvTg6cMMSI1kX88YrYYdIE/6E6D9L/vjIv509ZGuwboFNQoXj8KLyRGR4c1u+Y2YJDfnPBTNaSZKdel7TsmH7PZBSyP1KNZd3xPjTNVIz1zf5xbaPr73na2MBcl8qzGztbRoTbld/jTpUoAttCXXhyRytqFyYycJ4G14Ca4YxLn5wA==
for (let i = 0; i < 10; i++) {
setTimeout(function () {
console.log(i);
}, 100 * i);
}
mh2Cx4rQc3xHFU/jPoGV6xOv23WNAp46LOuLOndI5wriF+1pExndG9fdklYRQ/OT
0
1
2
3
4
5
6
7
8
9
const 声明
RK8ia+rHgxWMXKKLlPeB6KsBxEt56VSr6uvNPoNPIz4B/7q4yNB47p4Lm4+CEo+tOms29lzDepLMXWZvC5fBqA==
const numLivesForCat = 9;
7nhTyG90Hwx1scgLJKRbpClFCB5pK1AMq/vfxJC3UA/FPtL7d5BehufL+B6Xl3pAweybUTQb8Cv2fByA7OcXIQ+NPJBz0Pfk9fHt7UU8ApqGOMrnS/piAto1bXB4HI7cyuoT0sYHHKAIq//cPVI4cHhWxjWEeByIW5cNJU7T7yLv3nfPCU9m1v/oYmoxVjJ8ZCCgqNz8/NeHpI/iu9yZ6L+ODT8+HQsPuq5fjztOVtFiyr9c6NKb7On5zXbsJbaEXlcsCUdiDXwygPUXLjMjMyiF1wnFf+XBPHKT92Mobos=
yotmR1RfW+CY0bHao7GfY5ZtXHJ63TQxyh5liiZGEnU4D1sk2XDgFeQkv7oR/smpZz6nJIsp/Id6ulc0eh3cRg==
const numLivesForCat = 9;
const kitty = {
name: "Aurora",
numLives: numLivesForCat,
};
// Error
kitty = {
name: "Danielle",
numLives: numLivesForCat,
};
// all "okay"
kitty.name = "Rory";
kitty.name = "Kitty";
kitty.name = "Cat";
kitty.numLives--;
MSymEcaTb5Hfnax3bvSCUfAvXakiSKRE8spqZ0Bgw1skz2hWnzBCmL71xBDDwOlswFojUAGi+BAddqfyaYZpUWx/03nOZhlBFGc6GbOE2ts4PU28ZVEixFqZka5Kryff42QcMLcbNKbnzfHbiBWqGbifEP4m26GaNvSRezAWmd6annQnuGe3fy0qrH8lFVHoqjvyQ2on5jmoMBDHQhXpYkYhdUH5ngm5y+jJFU0IuL9s88hrFIBokjMGDP9rTgf9k0TJU3W+PV9K0glJjrjlwxV1OJPCPVq+GxswvUrvDO2DnQ5k7dWSLf7hXO4jVv5ssWNdLuwoLKD0Zk5BpFOxmFW0PIIm6kyFZrwmoiMRy/M=
let 与 const
0HIvAVKMhWgwZmj6q3o8FrU1BNhJ8Wut39TjHeKz1+51m8nvrJ7f1T04HM5ojeaKIrm/yZbKfVg/yxSH87yOIhGHIQt42Dtibrq+t5xOPzjtSK7YwwtqxrkqGJSR8OWBKfj4FyywEHurw91szqO2hCLFQ71CiWbXtTS+y0Us5fZe7VA9rQVRIgtQeg4as35CrumulANCYRjWOUVtxWuD70gYSVnSfh+nTXgrgim9FFU9W83Dy2eePX4rYj0Wb39k
Bu3WM7QCInfb9OZjWIWuuNtnIr/Df1u4VGnUzL/bYcizj5GK/k3626MLCOWaottnVJrn9iZZje2+dBMajb5tNN7UVKXvIoCyXmMB0BVXnXsaQCBfWAB5M6gFSDQBvfVMaT4cIFFBVaPpG7a0wSxv5JrMx3Kck+xwYy4zyzFhtEIGM71WOp7j7q1zCSR3AKCGx5UShacOG5i2OLAEgQDoTgJjiE3w27QGtZ9aH5dATacijIEl2/remzw1+H9NHRxURu59fULvax0bmSGdu1s/E6tRx6CTf7zlIocz7unQepmT0b2OcSC8qMEvX/E+XnYc/8Him0Tzv2woPfiChYRvSxtfcTI/G3U6aD6pwZnKmRo7CCojUHkXiGCBgCdqEnsZLxBUlRhRrSgDt/bAfsNH8MeUR868xKhTqvQH4QplH+xcUykAt2Z/sem4fx872a63FF0G2YHvRwHlCHogB/AeAz5V0wPiHemW7VjJ2PQTIU82bvSojtwqeu3vAb+4JJ4Sccj3OqZkxwVufrpFHBfzQqEiML0/9vVDogQ8hoQjpwI286beC5WLYGa80hBqusv/
b3GwS9U3Ltc7Dfnoq+65m8uH7iPfZWg4AjA/WqyNDtsugHLnWvphbtA6tNqKF3srws9UQTaxCzb+jqqtsrqEJz5MPhPVAtRRQoP3or486HcQAPlVhd6RqZ+VUU3zEGQL
GyY9SuY8fT1x+8Xm8W7Mo0pk3cNdG+4mcc/2V5nq0P9PImtgmWsXubaMRwJrS1PF/Ic/f/B/4BSGdskSOUE0Rg==
解构
1igvz5GNNDMYa/6+Yneckl/J3Rcxbik70rI0+snQ1o/A7FsL4Xb3TsVvMUtTtOEJ8J7apX3+8ZIrIJ/axq3vDpICuUMeyZwEb7lnkrqeZmiVa1SSI7Fqk4cX4N/fItirZCaThhkICLt7wAqTCtqdc124gJ3JbXe0fDdh4gc2SerCmeXRY7GY8lkxlPlCXTswoY24Qe/UFXklX1krV2rY9Rj6xoSph9owBgo47HXjLELQa3K5gArZVgrJWAdT9VL4wgL+v2XOzHOYUAR6FcTL8J1ctMfXaQ+aROAOYxSuksVL9/lmZgNqaHYfFLIjMuMY
数组解构
Ct+fL0ES3GBxP9lFeMkhEk5rWTmHM6sycTZupHyd8Rwvpq9Wi21vscctbrQyIlvEoFuD/9Z1NgHPxuw75sGM/w==
let input = [1, 2];
let [first, second] = input;
console.log(first); // outputs 1
console.log(second); // outputs 2
3ictbYlDrmv3sIZ5uCbIrp8NukJE8rUSon/Z24HGSthCj7rRSvdPBgR0p40nxI9QBIXRy/uH2m38e7SuVS9bBzfSSRxw7Pxf4pFVUNtIy7Av7QmlzAU6i/nsmQYIcy0aHc3KpWx38uMUozgI+/L6Yyss9zCE7dm3SyYWgHZhdhI=
first = input[0];
second = input[1];
/KojvOVqhTDaxRKIV6r38uiSrE6W3nnL8OdJJmj4b6n+1mzDL0a0oDchhHhiWXTf
// swap variables
[first, second] = [second, first];
zMnqQKZ4vzYyoDq9Jly8p/xoQk3s1Th6jfb41yugJxQ=
function f([first, second]: [number, number]) {
console.log(first);
console.log(second);
}
f([1, 2]);
cyKAZpoo3Q6BV60vYlmiSWf7WHUo7t0a1EJpb9ng345emq6rkCCAnXMKcTbSkOyGxpBSdmUAvoUeIX5qlJIujawyWwG+NoiPDEFPcqiavuUhyfqL6t79XzFPVai3It9+
let [first, ...rest] = [1, 2, 3, 4];
console.log(first); // outputs 1
console.log(rest); // outputs [ 2, 3, 4 ]
NaTM7vgv46NrVD1DK7LtHpmCTa0roIH3KyW6dfuna2t6u9iXie+4Wb4aEAD5B8xmUAhF3v5LGspWuvXf+I9oRFiGg9oYVvU1rY0vxjPk1DbRQnYtBlKUROuwOciQVsAR
let [first] = [1, 2, 3, 4];
console.log(first); // outputs 1
Aybrxy6SOSGHaQFm095rkfsEEW0kHzF3nHeQ3Epo7f4=
let [, second, , fourth] = [1, 2, 3, 4];
console.log(second); // outputs 2
console.log(fourth); // outputs 4
元组解构
cJ8nGCZaibpGiHKWVSJNHt0cDtXC95XDXYAysuIrOa9VI9k9/io6VQraZpPxhzQbT70YaMNJLFQovLsH3TC/Yc4xrWFjpGZPOLSGN571kZMtYR5qWJQqdg1Xio1QZAah
let tuple: [number, string, boolean] = [7, "hello", true];
let [a, b, c] = tuple; // a: number, b: string, c: boolean
BZnVceAE0Uj5bCoHGEuYzeDqdixZGkcLcmHYChTHoaWRkXnwATsbG7xKQ53Txy+yekc5gmgSfNdU4ATcWKXV8A==
let [a, b, c, d] = tuple; // Error, no element at index 3
y6mggggM9wj+8Q8PVeMcKClX7fGDFkj27sD/SHbk0ADu47QJ67OrdOIARy2tk/XxrK8sQspke6Fwmr4gtkU7mC6ZbOhq/VBzciX3J/2nBzkBLfMiJPFCzV9xbmiPkOOJybmCOAr+nDo17nRK5q0qfw==
let [a, ...bc] = tuple; // bc: [string, boolean]
let [a, b, c, ...d] = tuple; // d: [], the empty tuple
VS/HXjGFZlncs19R72WMKLgU0tYPf8g4mboUx1JpDJrDrp4bvOLX7lk4VmbIA3wD
let [a] = tuple; // a: number
let [, b] = tuple; // b: string
对象解构
FkeIGIJLsIyH8Uc+V3yNrbcC0rODRip6dPnfO+eg1Ms=
let o = {
a: "foo",
b: 12,
c: "bar",
};
let { a, b } = o;
2zSKqgMLgc7KffvFEHPGqRtoxoVAa3XCRdFODqQSV1EJZfJEAWGN6WNDtvPw0zWPjKYwX+WtKvYawajklBWtMG5AVUOqkPSZj46Rgac8kEJTT4CIcx2jzFIXoZ0v6GZ581NaZUsUDxXX4GEJ2tpSR7IKsavnfR+mcGlb000y3kz2geX9QRQ1rDCPesN8TidzXpBvEY4J94trTTGydPD/rFduLOGyzVkTHz3UHzsQOts=
bsUfPEnX9KBrCt32SvR2/IpGl7OkAVPylB9yReWg3K+KvR1mKTWVylClrnBLaWUIn9iCEpZC2p9msAwAekLufzcY6n7EDfiF2ejIXgZB/Y8=
({ a, b } = { a: "baz", b: 101 });
s5LoDfGjvBxoULHJFEwwyglR7sCjTPVeZZQa9mZAAfEDZi/qL0fF3W1ARYJ6OYtDDCsuy44L95J/Bys1cAByZsZSYWRmOiutJLoFcvKBQ2eNauaZ3vOb/NVLOefr3clFTAUjYD5yKBxTkG3QQPMX9zsNe40ySN8Kd8mxnC3xQnI=
cyKAZpoo3Q6BV60vYlmiSWf7WHUo7t0a1EJpb9ng345uROYzjX54P/xric2cp4bznJO5BJ7AB8nWKQM1oPdzgiHBBFJOYkRiViVJwuaIzc4=
let { a, ...passthrough } = o;
let total = passthrough.b + passthrough.c.length;
属性重命名
SRvJebxvoopYJRZH5iVrYU+k5yMbwoKsp30iaDd9NtphW5bOuu0okA7U4MUlSiUi
let { a: newName1, b: newName2 } = o;
pWNhE9v/We83eg1jV3RyHJWhIlpf+4AtyaXL7Gtr802MqleckPteFb0T6bQCpKuaJNbD0yDicN8PyEXClf0WZ2lCo0U6LOUhf7COAETTlbgKzf2qcYg9iasCEgFLUNGi9b9diA8hjg3EduaRMkDA9gWnn5YiBEN5GFIkJkLpQ1DCBIEw/mg6b/aKKlixYFPrkD2iGfFyQkJ8KVwRuBdQua38Dw+PUal1JlYoXo0CkEMA1o7kiMyR30PRSpVFjb9r
let newName1 = o.a;
let newName2 = o.b;
WuenNB8Q/QETHi0q108eehxRrVSLvL2pBt4JZOHXZseJNTUfJyQylmmeTSdnXBXULOvWoypLk0D0EWJgMMpU0cZWTao/CMTRPtY1hO4HHVUo8G2U1YYvCWG1ddEVWc9dmKxWVEa9VacfnumW19t+DTLcrLZHg1/kz6uljWXkJem5RJrdrh6xga023Ynck2Ry
let { a: newName1, b: newName2 }: { a: string; b: number } = o;
默认值
14AYiQKkVjgYhZHHAb8cvWR6mrrg7QbXXNpToFNco79c/BH7hvUMaZLxV1K2B9Wwcu8WbDFfYoS1z29WjQhZ2ExaVui1sotNYyKfSz8OUq0=
function keepWholeObject(wholeObject: { a: string; b?: number }) {
let { a, b = 1001 } = wholeObject;
}
8hmq7/YoYr3g+FVVzJEORazerIvrj3SoLncJCZ6nQav1ILOXtNZNc2Znw11RyZLxMpntv/wvZj5okeEY5rOYiGtyO4l5w/iGYq/dsPUBZfhRoemZo6CFDU8Z5WTM9nIsRaL8RyuSrC2gVrb4RnZpGtrwPBkHr4J/zRQgxlscVmepmzbHFiwoqitqTc8hWS85oaLPgbIbHkw3peXByZXgqtOGqO13dX+HnGEcbZd3623CofSx8yuNqP44DnuzCk1AkZcHiBbnK1LC7q1UowP6VV9v3hMe53UeTcjEpmbxY64+MK9pfZ4UT5ToVeXfA+KAN4eVwMR9XcfhXBy0Sg3zr6wI6b6nfhgiAecDhgtD/lORpuXTUStMARFYYTEHfGII
函数声明
/KojvOVqhTDaxRKIV6r38h9nWxAAkhPms/egzgtp61HTI5+DdlvRf93LvGjb1/LO++/esQ/tOAg3+N88haVX3L2CgehSkatoJ8dQ7W7UyCY=
type C = { a: string; b?: number };
function f({ a, b }: C): void {
// ...
}
OWeQCFB0dqlAf/BEaHOW+UNfeSNPjxNCdLBLHOBVu8DwbNQI1EmriVg604S9iwF5gNngx/vIv9+/770/0/zXm6sfjsXw03LErQnFhqarmRLsCb53KW3ly38FMi9B3XdAq51x6+N2oEbhM31Np+Db/P3k5XYcxRn+dWF/G86kf2HzxMvj67jO90xWL4H+uGYV4kQQVLy+zBsxGXJ/k4ixog==
function f({ a = "", b = 0 } = {}): void {
// ...
}
f();
klp1/zjKghis7rVwhhj/3m8Q0upPGY2K3hsGsZvLS1KKRL+a7ZXLBW0nv4SKRQTdjvB2V3j9dKvBLw7UlOy53se+Cy684Yl/a3Vg5ZJ6TdjNcFunjj6e/fab1oYlyIaC
nTST7f8ac0YQQTAzvdobO44iRvXc6jypDj0F56OkirAmz9Xl0bH4IxMbG1kJxZQ905tqtaOu65ivsVOO+ywaaLbpEs6XjGeFm41kVROoAQWDy3EvMwYIZrdZXI5NUkE+HlQRwsyB+ERfoSTQWmbk1udHl3G1r7TxoBfi8QF8k1JALEiYinyxT5lfmNyAbhM32gp4BvZyJPCairLFkNLTAC1OtMvwcRQb1zzSGJ8F0Ik=
function f({ a, b = 0 } = { a: "" }): void {
// ...
}
f({ a: "yes" }); // ok, default b = 0
f(); // ok, default to { a: "" }, which then defaults b = 0
f({}); // error, 'a' is required if you supply an argument
xJJAej8Fsq7ZXFmmUNSCWM84ToRzgQ6BVbwzJyE3nZB8ZhqjDtT4AlnVm4OOzoF41aLnnZwY1pwEgryUwHf0phQBBTUJXxc8fw8yx75HK6k5T+s2wpzZhIMD13kgcvhUt7Yuyp3Zy+E6zhDQz4S/XnBkl7m4LjfRHR/GBFc7nd/V0yKSD5X3vC6uX7GBFOva7RDbmenxaNUKReBJ/piTcGjatKSH3QTbFOtvp61N8w2MdPE7fnqkqCkXwNQb5QUmHN1XcgfchgVImCgxq7lTSJkelf9qd5UpvW/iKKOGp+vwiFCE4iceicFfWNeKEcoGAd8ed5jywX7yxOgaNQIA/zTB8mfV4Lfv+kQmK1K0uaBKQeuDeGWxCSDoqlYifoOKnYHN3yNJBI29v5k1wPe6dikSTZKFp1JeU+GJ9qU+SKOvUNIeNzuRhV/IiSIAVjDTRdYmlD50xQ7YukzsvjqwWA==
展开
VrQQ/4KAG0Lc4UWEethwEtRPG9lIGjsJSKdALZBiOENRWnKph+PkqNJyEwJnEBqsTFadj3rzW+T6Pkx9laMWAJCuh51XNlhH60uE06BEUKlD+E/+0ocWOO/r2NXbvVAoQ5UOzzYq/ZKXq9jnZzKVzubkAea0jj+t7YwH/JMbvy8hkRuNophJOqtOGXeRdv81njzLethFtKOIs7TPs+/0rg==
let first = [1, 2];
let second = [3, 4];
let bothPlus = [0, ...first, ...second, 5];
j480pF8Sqv920UeMh0D5jpDOJ3Ot6FXj4SYUWJnGs/ZoiZBeptHAFQLW1MbGZ2gXrBL8h1+jyBHy763O9XqLTv/TviiBmdDvBXAziznzkUowZUYnM4mVrQSczRbyh3YWGg28ciUCozFDvOsdYL1s3DNB5w9VNx7/cvRMPSYwbqjrG2WAzeeTZjv12bLdtaiyMK0vdgG8x+1kTvu6pshmIvSq8RIwcv9qaeCjOiwa5xQ=
R2pRCxOdMfQQEBE1pk3kUsSmnpXy2iQu4csRB5Pw3PM=
let defaults = { food: "spicy", price: "$", ambiance: "noisy" };
let search = { ...defaults, food: "rich" };
UneoIndXMZHtXiBSBQOPTkF460sl86PoV+oCAseIAJcRmznJ3kwuXKfqms9hbIQFNFCLnb3gfoNaB4oy2q6nxQrJdJVOyCEqL8MRTC2bNtv9g5Ma/tqbURBrPiFMQ2zy+tZNA4LtLy8KnakN6Hwx+IqXTG0YjfzkPshfVPz9/QanbdNyfC7NkHT+EfYfSlu9BI8U+rwEL++Hfwz9zzIb8A2by2Vc5aDtPLYsDmaaOzOkCIRRODCl6rTnSqnZFA/uzPk+FwHOiXJvO6VoETEKF2ZiIbgbhiiRWxbPIqK/zg9Mjoa1F2RDyw9YT12tX5if4tm0AwiGom+TI7jEm+75oFLzCjgJSOhw4q9tmx144ScZRkIvAppTHeQTpGGCrGOu4i1OYCUOXe8r4PbQtvjYnKaQDoya2J6WyRHqm882F3a5hFwLwK5OefeMvG34hMTdgNjlOFfr8yJgsWAbB4MzWPlpGt/OP+8m803j3xGJ6OU=
let defaults = { food: "spicy", price: "$", ambiance: "noisy" };
let search = { food: "rich", ...defaults };
qwvjZXWk1Stru6v4RlmXd7r2uGyk33GjlhmJmKmb/a466J8ssX195Yyck2aM7lZ1iISv3nx3+0lZOfgx4IBWYOKA38XTZmGCg2pL4i6/LcnFNWtBIBUXbs4IwitdEDIFNkUGpNIXONVglS86NYD9FgIVpz1/oV1kdenKlZJbpkbodbpYOldyRCcuIyo98k2S
4AqTGR94pje+oBtEridByvv2lu5PHeYH67rxIEULca3XOEdTQJX7vIoMRNZ/AR/OsSc4F/9MC3bsZJuR27LT4roKH5r8UU6s+mdBxvb5OY7b3UjwQ6wqZk4Kmmk0wERTVYx6MnCS9IranIat9+xWDuMg+ncnjayHGcn3fRnL52crpd0kmq8+QRtXG5GJj04h12N5OAtlGX0NZ96Jes/ox7dcF9dvIROel4GQnP53/E4s0XPQ6QQkGiJxdEIc4iR6XFRLjAaAaX+cZb3vIOg2s+gdapd+YSStN8ge7tgLs2rj2Se/GqblTzhsWZMAbRtG
class C {
p = 12;
m() {}
}
let c = new C();
let clone = { ...c };
clone.p; // ok
clone.m(); // error!
/yBhjU9UbGnukWD0Gw37FPnTQzQZyqHj1OxOMRUuhRKZeWoF2oMGdz+AhpB2Jd0Ufz/R5B7AAqaF50qhqziJb9v5aPYlFVPkJjKUpEj2Q6/5FXm3Q/f6IOAT52zWpcc6G+ahzKDx5X+jiLiu1lvhpuxibCkdGDXZ+1jlk4AzWOqI1qLlnPHrIL1Im9CiGohj