为人类而写。 带有代码片段。 在5分钟内。

> Work Hard by Uran

术语的目的是将一个特定的想法封装成一个优美而紧凑的词。 但是，如果您0 ] J 9 3不了解单词的含义，就会失去意义。

在开发人员世界= E 7 ,中，更高级的主题通常是遥不可及的，并且常常使新开发者望而却步。 部分原因是因为他们好像在读一本外国小说。 字母和单词可能看起来很熟悉^ , 5，但是没有意义。

而且很难理解所有内容，尤其D $ ; = x m ^是如果您必须不断停下第二个单词来弄清楚句子试图告诉您的内容时。

在本文中，我决定编译我经常发 } / v现自己会为新开发人员翻译的. [ o前7个概念。 我希望您发现他们对成为更Q / 5 ! O /好的开发人员有用。

本文的重点是作为思想的参考/摘要，以帮助您尽快着手解决问L I $ p j z题。 每个术语本身都8 - W 1 U是一个主题，但出于篇幅和易读性的目的，我将其尽可能地简化为核心思想。

本书内容远不止这些，但总的来说，它抓住了每个单词K ) Y试图传达的实质。

希望您发现它们有用。

感谢您的阅z y 9 x读！

1.不变性

数据形状不变时。

因此，如果您有一个进入函数的对象，则, _ ` b K s它以完全相同的形式从它中出来。 附加到它的数据可以更改，但参数的数量，名称和顺序不能更改。

例如，这是一个突变：

funu 1 - ~ction changeMe(someObject){ 
  someObject.age = 3; 
  return someOx r Z / + _ . nbject; 
}
let exampleOne = {\"cat\": \"Tibbers\" };
consolel N b /.log(changeMe() A } &exampleOne));

该函数更改对象* 5 P的形状，这意味着它是可变的。

2.陈述式

无论您按什么顺序进行操作，基本规则都可以确保您每次都能获得相) D D r O M同@ k S z {且正确的结果。

例如，该数学) 5 v方程式遵循声明性方法。

(2 x 5) + 8 - 3 = 15

因此，如果您移动顺序，您仍将获得相同的结果。

- 3 + (2 x 5) + 8 = 158 - 3 + (2 x 5) = 15

在Z | : ] mJavaScript编程中，声明性模式是函数的顺序与最终结果的构造无关紧要的地方。 您可以按任何顺序调用它们。 顺序无关紧要。

3.递归

当函数继续调用自身直到满足特定3 Y 8 3 % | k p条件时。

不，这不是for循环。 听起来可能是这样，但事实并非如此。

for循环是JavaScripI a ; Rt的条件方法。 递归是一个不断调用自身的完整函数。

这意味着递归有两个部分-基于特定条件的调用和exit子句P * 6 _ W ` 8 K }。 您的退出子句基本上就是在递归结束时发生的事情。

这是一个简单的潜在递归：

function sumProfit(sales)% ; D O + n J{ 
  if(//condition for ending){ 
    return theFinalObjectOrResult; 
  } eb ? : 6 [lse { 
    //do something. ReC 2 H L t @ U Oduce the condition. 
    return sumProfitf M u e o z(r8 j { T ,educedCoB W T @ndition); 
  } 
}

4.回调

回调是在另一个函数执行完毕后才执行的函数。

我们为什么需要G 5 H R g i E p 4这个？ 因为JavaScript是事件驱动的-意味着它不等待响应。 当事情以自给自足的: E 7 C方式运行时，这无关紧要。

当您开始依赖外部响应（例如API）时，情况就变得很严重。 延迟是您的JavaScript代码发送请求并将其接收回来所花费的时间。

在JavaScript看来，它已经完成了- x ! F g D . = -工作K n 3 W ] . # P-它已成功执行了代码。

但是，实际上，您仍在等待回应。 有o J r T时，您会通V o W 3 z j K W Y过诺言或延迟计时器迫使代码冷静下来，放松一下，等待片刻。 确认完成后，您可以调用callback` : ; N [ m（）函数。

无论如何，这是回调的样子：

functW v 9 r 7 t S M eion waitForMeeeee(someValues, callback){ 
  //dE | n b w c a ,o something with someValues 
  callback(); }
wait= + : S | .ForMeeeee(\'The answer is 42\', function(){ 
  alert(\'all done now\'); }
             );

您还可以抽象出回调，并使其如下所示：

function waitForMeeeee(someValues, callback){ 
  //do st 2 +omething with s Q p 8 0 7 W momeValu& 6 j + 6 _ [  kes 
  callback(); 
}

function allDone(){ 
  alert(\'all done now\'); 
}

waitForMeeeee(\'The answer is 42\', allDone);

5.异步

想想一条直线。 您的JavaScript代码从一端执行到另一端。 但是有时候，您需要暂停一下，只是在g | i X Z d t y -您跑到外部来源抢东西的那N + + ( {一刻。

暂停的时刻是JavaScript的异步部分。

关键字async还返回隐式的Promise。

隐式是什么意思？ 默认情况下，它返回一个d ` y 7 P a 3 ; Mpromise。

什么是诺言？ 这是告x b X , h Q诉您的代码等待的原因，因为完成某些工作8 ` = 9 D % 2会有所延迟。 例如，您在等待外部API用正确的数据响应。

为什么这很重要？ 因为您可以将then（）与异步函数一起使F [ X用。

那么（）是什么Z s d t v ~？ 您的回调相当于基于承诺的函数，可让您在承诺完成执行后执行操作。

看起来像什么？ 这是一个例子：

as- R G h S S j Y 5ync function doSomething(){ 
  //do something ther/ ] t Ae. 
  return \'woot!\';}
doSomething().th+ + d P 7 0 Xen(function(result){ con{ g & $ 1sole.log(result)g  f z 5 R u * v;});

或者，如果您真的O D d想使承诺部分明确| 5 2 3 a H X &：

async function doSomething(){ 
  //do something there. 
  return Promise.resoh 3 - w B slve(\'woot!\');
}
doSomething().D $ b x + 6then(function(result){ console.log(resultO % ^ V S g +);});

6.代理

将其视为对象的附加扩展。 可以针对已存在的事物创建自定义行为。

在某种程度上q G } f q，它还充当原/ e S始对象和其他功能之间的中介。

是。 代理可以更改/ h M , F和处理数据。

是。 除其他事项外，它通常用作验证检查器。

它是如何工作的？

代理包含三个部分-处理程序，陷阱（即方法）和目标。

有13个可用于代理的陷阱。 您需要对它们进行Google搜索，因为这超出^ * W v d j S k |了本文的范围。

这是一个已实施陷阱的代理示例：

let ha3 K ) 8 o R M Nndler = { 
  get: function(theObjectPassed, theObjectName){ 
    //some checking logic 
    console.log(theObjectPass! A ) 0 ` h v w Bed, theObjectName); 
    return \'all done\' ; }
}

let someObject = { a: 1, b: 2};
let valueName = new Proxy(someObject, handler);
console.log(valueName.someObject);

代理的功能远不止于此，但是示例只是一个起点。

7.垃圾收集

一切都占用内存。 初始化变量后，将为其分配一点空N e 8 e m i N b U间。

内存仅在调P 7 + a ] v y Z $用时初始0 g p化。 因此，当一个函数运行并且内部有变量时，它的存在只会持续到该函数需要它的时间。 它不会停留在周围。

垃圾收集是清除内@ O t ( j = U存的方式。

内存泄漏是指由于在全局空间中声明了变量而没有进行垃圾回收的情况，这会造成污染并占用不必要的空间。

这太多了Y S ~ f # g L z，F = d : ( A ! % q您的应用程序可能会变慢。

因此，请尽可能保留变量，并使用null取消初始化不需要的内容

(本文翻译自Aphinya Dechalert的文章《7 Major JavaScript Concepts Explained Simply》，参考：https://medium.com/javascript-in-plain-english/7-major-javascript-concepts-explained-simply-45b0f3336f28)