OnlyJS

简单解释7个主要JavaScript概念

2020-04-13  本文已影响0人  码上说

原文来自 Dotted Squirrel: 7 MAJOR JAVASCRIPT CONCEPTS EXPLAINED SIMPLY

术语的目的是将一个特定的想法封装成一个优美而紧凑的词。但是,如果您不了解单词的含义,它就毫无意义。

在开发人员世界中,更高级的主题通常是遥不可及的,并且常常使新晋的开发人员不愿这样做。在某种程度上,这是因为感觉就像他们正在读一本外国小说,字母和单词可能看起来很熟悉,但是没有任何意义。

而且很难理解所有内容,尤其是如果您必须不断地在第二个单词停下来以弄清楚句子试图告诉您的内容时。

在本文中,我决定说说为新晋开发人员量身定制的7个主要概念。我希望这些对他们成为更好的开发人员有用。

1.不变性与可变性

如果您有一个函数的对象,那么附加到它的数据可以更改,但是键的数量,名称和顺序不能更改。

例如:

function changeMe(someObject){
   someObject.age = 3;
   return someObject;
}
let exampleOne = {"cat": "Tibbers" };
console.log(changeMe(exampleOne));

该函数更改函数内数据,这意味着它是可变的。

2.顺序

无论您按什么顺序执行操作,基本规则都可以确保您每次都能获得相同且正确的结果。

例如,该数学方程式遵循声明性方法。

(2 x 5)+ 8 - 3 = 15

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

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

JavaScript编程中,声明性模式是函数的顺序与最终结果的构造无关紧要。您可以按任何顺序调用它们。

3.递归

当函数不断调用自身直到满足特定条件时。

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

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

这意味着递归有两个部分-基于特定条件的调用和exit子句。您的exit子句基本上就是在递归结束时发生的事情。

这是一个简单且潜在的递归可能看起来像:

function sumProfit(sales){
  if(//condition for ending) {
      return theFinalObjectOrResult;
  } else {
    //do something. Reduce the condition.
    return sumProfit(reducedCondition);
  }
}

4.回调

回调是在另一个函数完成执行之后执行的函数。

我们为什么需要这个?因为JavaScript是事件驱动的-意味着它不等待响应。当事物以独立的方式运行时,这无关紧要。

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

JavaScript看来,它已经完成了工作-它已成功执行了代码。

但是,实际上,您仍在等待响应。有时,您会通过promise或延迟计时器迫使代码冷静下来,放松一下,等待片刻。一旦确认完成,就调用该函数。

无论如何,这是回调的样子:

function waitForMeeeee(someValues, callback) {
 //do something with someValues
 callback();
}

waitForMeeeee('The answer is 42', function() {
  alert('all done now');
 });

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

function waitForMeeeee(someValues, callback){
 //do something with someValues
 callback();
}
function allDone(){
  alert('all done now');
}
waitForMeeeee('The answer is 42', allDone);

5.异步

想象一条直线,您的JavaScript代码从一端执行到另一端。但是有时候,您需要暂停一下,例如去外部获取资源的时候。

暂停的时刻就称之为JavaScript的异步部分。

关键字 async 返回隐式的 promise

隐式是什么意思?默认情况下,它返回一个 promise

什么是promise?它告诉您的代码等待的是事情,因为完成某件事会有所延迟。例如,您在等待外部API以正确地进行数据响应。

为什么这很重要?因为可以使用在async函数后使用then()

什么是then()?您可以把它等效于回调函数,它使您可以在promise完成后执行操作。

那么它长什么样呢?这是一个例子:

async function doSomething(){
 //do something there.
 return 'woot!';
}

doSomething().then(
function(result){
  console.log(result);
});

或者,如果您真的想显示地调用promise

async function doSomething(){
 //do something there.
 return Promise.resolve('woot!');
}

doSomething().then(
function(result){
  console.log(result);
});

6.代理

我们将Proxy视为对象的附加扩展。它是针对已存在的事物创建自定义行为的能力。

在某种程度上,它还充当原始对象和其他功能之间的中介。

是的。代理可以更改和处理数据。

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

它是如何工作的?

代理包含三个部分-处理程序,方法和目标。

有13个可用于代理的方法。您需要上Google搜索一下,因为这超出了本文的范围。

这是实现代理的示例:

let handler = {
 get: function(theObjectPassed, theObjectName){
  //some checking logic
  console.log(theObjectPassed, theObjectName);
  return  'all done' ;
}

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

代理的功能远不止于此,示例仅是开始。

7.垃圾收集

一切都占用内存。初始化变量后,将为其分配一点空间。

内存仅在调用时初始化。因此,当一个函数运行并且内部有变量时,它的存在只会持续到该函数需要它的时间。它不会停留在周围。

垃圾收集是清除内存的方式。

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

这太多了,您的应用程序可能会变慢。

因此,请尽可能保留变量,并将您不需要的内容置为null

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

这里写的内容远远不止这些,但总的来说,它抓住了每个单词试图传达的实质。

希望他们对您有所帮助。

感谢您的阅读!

上一篇 下一篇

猜你喜欢

热点阅读