手机周围噪声功率多大_周围到处都是噪音。-CSDN博客

手机周围噪声功率多大

by Donavon West

由Donavon West

周围到处都是噪音。甚至在我们的源代码中。它可以分散我们对重要事物的注意力。 (Noise is all around us. It’s even in our source code. And it can distract us from what is important.)

Noise! Noise! Noise! It’s all around us. That person on the train playing a video game on their phone with the sound on with no headphones. The guy who think’s it’s perfectly within their right to hold a speakerphone call while in line at Starbucks. Emergency vehicle sirens, and cars honking at a traffic jam (as if that will solve anything).

噪声！噪声！噪声！到处都是我们。火车上的那个人在不打耳机的情况下，在手机上玩电子游戏。认为在星巴克排队时保持免提电话完全在其权限之内的人。紧急车辆警报器，以及汽车因交通阻塞而鸣喇叭(好像可以解决任何问题)。

Noise can be seemingly as innocuous as someone not muting their laptop during a meeting — until, that is, everyone is forced to hear the Slack notifications that arrive every 3–4 minutes. Do you want to be that person who asks them to place their computer on mute? Or do you bite your tongue and try to ignore the “cla-clunks” as you try and concentrate to the presentation?

好像有人在会议期间不静音笔记本电脑一样，噪音似乎是无害的，直到所有人被迫听到每3-4分钟到达的Slack通知。您是否想成为要求他们将计算机置于静音状态的人？还是您在尝试专注于演示文稿时咬住舌头并尝试忽略“ cla-clunks”？

noise /noiz/

噪音/ noiz /

Noise is such a problem that it even has its own day — International Noise Awareness Day.

噪声是一个问题，以至于它有自己的一天- 国际噪声意识日。

视觉噪音 (Visual Noise)

But noise isn’t just limited to sound. Our eyes can also be inundated with noise. Billboards, advertising on park benches, and flashing neon store signs all contribute to visual noise.

但是噪音不仅限于声音。我们的眼睛也可能被噪音淹没。广告牌，公园长椅上的广告以及霓虹灯闪烁的霓虹灯招牌都会造成视觉噪音。

Many cities have ordinances limiting outdoor advertising and distracting architectural design. In Scottsdale, AZ for example, many buildings are a light tan color that blend into the natural surroundings. Contrast this with Time Square in New York City. Pass the aspirin please!

许多城市都有限制户外广告和分散建筑设计注意力的法令。例如，在亚利桑那州斯科茨代尔(Scottsdale)，许多建筑物都是浅棕褐色，与自然环境融为一体。将此与纽约市的时代广场进行对比。请通过阿司匹林！

代码噪声 (Code Noise)

I know what you’re thinking, “Donavon. I started following you because of your keen insight on technical issues. Is there a point to all this?” First of all, “Thank you.” And yes, I’m glad you asked!

我知道您在想什么，“多纳冯。由于您对技术问题敏锐的洞察力，我开始关注您。所有这些都有意义吗？” 首先，“谢谢。” 是的，很高兴你问！

The point is… Coding can be complex enough without adding extraneous noise, or what I like to call “visual clutter”.

关键是……编码可以足够复杂，而又不会增加外来的噪音，或者我称之为“视觉混乱”的东西。

Let’s look at a few examples.

让我们看几个例子。

重复的代码节 (Repeated Sections of Code)

Code that’s unnecessarily repeated can be considered visual clutter. Don’t repeat yourself. Not only does writing DRY code reduce the chance for errors, but it is easier on the eye.

不必要重复的代码可视为视觉混乱。不要重复自己。编写DRY代码不仅减少了出错的机会，而且更容易实现。

Take the following example. Look at all of the repeated code.

请看下面的例子。查看所有重复的代码。

const Foo = () => (  <div>    <Bar className="fruit medium">      <span>Apple</span>    </Bar>    <Bar className="fruit medium">      <span>Orange</span>    </Bar>    <Bar className="fruit large">      <span>Watermelon</span>    </Bar>    <Bar className="fruit large">      <span>Jack Fruit</span>    </Bar>    </div>);

But we can DRY this up nicely by putting the repeated code into its own component and get it out of sight by placing it in its own file.

但是我们可以通过将重复的代码放入其自己的组件中，并通过将其放置在其自己的文件中而看不到它，来很好地进行干燥。

const Fruit = ({ size, type }) => (  <Bar className={`fruit ${size}`}>    <span>{type}</span>  </Bar>);Fruit.defaultProps = {  size: 'medium',};

Now Foo is as DRY as bone.

现在Foo像骨头一样干。

const Foo = () => (  <div>    <Fruit type="Apple" />    <Fruit type="Orange" />    <Fruit type="Watermelon" size="large" />    <Fruit type="Jack Fruit" size="large" />  </div>);

React无状态功能组件与ES6类组件 (React Stateless Functional Components vs ES6 Class Components)

Here we have a traditional React component written using an ES6 class.

在这里，我们有一个使用ES6类编写的传统React组件。

Hello class extends Component {  render() {    return (      <div>Hello {this.name}</div>    );  }}

Notice that is doesn’t keep any state, and doesn’t use any lifecycle events. Why then aren’t we using a Stateless Functional Component (SFC)?

请注意，它不保留任何状态，也不使用任何生命周期事件。那为什么不使用无状态功能组件(SFC)？

Here is the same component written as a SFC.

这是编写与SFC相同的组件。

const Hello = ({ name }) => (  <div>Hello {name}</div>);

Notice that a SFC is basically just the render method of a traditional ES6 class component. Because it’s not an instance of a class, any props referenced don’t need to use this. And because all we are doing is returning a value, we can use the “single statement” form of the ES6 arrow function, which means we can also eliminate the return statement.

请注意，SFC基本上只是传统ES6类组件的render方法。因为它不是类的实例，所以引用的任何props都不需要使用this 。并且由于我们所做的只是返回一个值，因此我们可以使用ES6箭头函数的“单个语句”形式，这意味着我们也可以消除return语句。

Using a SFC allows us to cut nearly half of the code. But please don’t think that this is a contest to write the fewest amount of lines (making your code too terse can also make too hard to understand). It’s about eliminating the unnecessary, the boilerplate, and it allows us to focus simply on the problem at hand.

使用SFC可使我们削减近一半的代码。但是请不要以为这是写最少行的竞赛(使您的代码过于简洁也难以理解)。这是关于消除不必要的样板，它使我们能够专注于眼前的问题。

SFCs help to reduce the signal to noise ratio.

SFC有助于降低信噪比。

自评码 (Self Commenting Code)

Commenting your code seems like a good idea, right? But many would argue that comments should be added only when you need to explain something that may not be obvious or to explain the problem. The code itself should be written in a matter that make it self-commenting.

注释代码似乎是个好主意，对吗？但是许多人认为仅在您需要解释可能不明显的东西或解释问题时才应添加评论。代码本身应以使其能够自我注释的方式编写。

Comments should be used to state the problem. Your code shows the solution.

注释应用于说明问题。您的代码显示了解决方案。

Take this following example.

请看下面的例子。

// display a message if high risk and driver has too many accidentsif (driver.age < 25 || driver.age > 85 && driver.accidents > 2) {  doSomething();}

Not bad. We’re all used to reading code that look like this. But it’s complex. Now consider this example.

不错。我们都习惯于阅读看起来像这样的代码。但这很复杂。现在考虑这个例子。

const { age, accidents } = driver;const isHighRiskAge = age < 25 || age > 85;const hasManyAccidents = accidents > 2;

if (isHighRiskAge && hasManyAccidents) {  doSomething();}

Notice that we didn’t eliminate lines of code — in fact the code size increased — but logic is spread out into bite-sized pieces which your brain can evaluate and set aside. And by using descriptive variable names (i.e. isHighRiskAge and hasManyAccidents) , the if statement is now self explanatory, eliminating the need for the comment.

请注意，我们并没有消除代码行，实际上是增加了代码的大小，但是逻辑却被分解成一小块大小的部分，您的大脑可以评估并保留这些部分。通过使用描述性变量名(即isHighRiskAge和hasManyAccidents )， if语句现在可以自我解释，从而无需注释。

Another big plus of eliminating comments is confusion. Today you write and comment your code as follows.

消除评论的另一个重要好处是混乱。今天，您编写并注释您的代码，如下所示。

if (age > 75) { // do something if over 75

Tomorrow you find a bug and change the code.

明天您将发现错误并更改代码。

if (age > 85) { // do something if over 75

But did you remember to update the comment to match? Maybe? Maybe not? Another programmer reading this code months from now might read the comments and be thrown off. Computer’s don’t execute comments.

但是您还记得更新评论以使其匹配吗？也许？也许不会？从现在开始几个月后再阅读此代码的另一个程序员可能会阅读注释并被抛弃。计算机不执行注释。

Don’t comment the obvious.

不要评论明显的东西。

小型可重复使用的组件 (Small Reusable Components)

Creating smaller, reusable components can also reduce visual clutter. Take the following example.

创建更小的可重用组件也可以减少视觉混乱。请看下面的例子。

const Foo = () => (  <div>    <div      style={{        color: 'red',        width: '200px',        height: '200px'      }}    >Hello World</div>  </div>);

Not bad, but we can do better. What if we created a RedBox component that encapsulates the styling?

不错，但我们可以做得更好。如果我们创建了一个封装样式的RedBox组件怎么办？

const Foo = () => (  <div>    <RedBox>Hello World</RedBox>  </div>);

The details are now hidden away out of sight. You only need to look at it’s implementation if there is a problem. Otherwise you should assume that RedBox is doing it’s job correctly.

现在，这些细节已隐藏不可见。如果有问题，您只需要查看它的实现即可。否则，您应该假设RedBox能够正确执行它的工作。

Below is an implementation of RedBox that uses using Styled Components which allows to to reduce visual clutter even further. If you haven’t used it before, check it out!

以下是RedBox一种实现，该实现使用了样式化组件，这可以进一步减少视觉混乱。如果您以前从未使用过，请检查一下！

const RedBox = styled.div`  color: red;  width: 200px;  height: 200px;`;

结论 (Conclusion)

Eliminating all forms of noise from your life can do wonders for you mental health. Take a walk in a quiet park, free from the chaos of the city streets. Enjoy the pleasant sounds of birds chirping and the natural beauty of the trees. Just stay clear of the playground! ?

消除生活中各种形式的噪音可以为您的心理健康带来奇迹。在安静的公园中散步，远离城市街道的混乱。享受鸟鸣和树木自然美景的宜人声音。只是远离操场！？

I also write for the American Express Engineering Blog. Check out my other works and the works of my talented co-workers at AmericanExpress.io. You can also follow me on Twitter.

我也为《美国运通工程博客》撰文。 在AmericanExpress.io上查看我的其他作品和有才华的同事的作品。 您也可以在Twitter上关注我。