16
头图
Everyone on the team will use a different perspective to'examine' your "work", so how do we come up with a project code like a work of art, and then win the praise of colleagues?

Author/ Qiong Hu (An Zengping)

Edit/hjy

00 Foreword

After joining the Youdao quality class team with high technical background, I found that some of the "workshop" habits I had developed in my previous career must be corrected.

In daily work, R&D students only don't need others to care about their own code during the coding stage, and other scenarios where they need to show their output to others have become very common.

To give a few simple examples:

  • After the feature is admitted, colleagues in the same product business line need trans-review
  • mentor requires Lint-review every quarter
  • Diff-review is required after the second round of testing
  • ......

Everyone on the team will use a different perspective to "examine" your "work", So how do we come up with a project code like a work of art, and then get praise from colleagues?

Keep doing the following points in the project, you can harvest the artistic code of the palace.

The following points are the conclusions drawn from communicating with team members regarding their own shortcomings after taking over several projects such as the sales conversion system and the quality inspection system.

01 Use meaningful variable naming

When declaring a variable, inject its role and role into it as much as possible:

Declare a function, using compound verbs instead of nouns:

When declaring that a set contains multiple contents, remember to use the plural form:

When using mathematical calculation formulas, declare constants in advance as much as possible. The injection of constants will help improve your readability in the maintenance code phase:

In the callback function or the formal parameters of the function declaration, try to keep the semantics of the formal parameters to avoid seeing the previously declared i, j, and k randomly in the later maintenance process, and then return to the original callback place for viewing, which affects the development efficiency :

(At the same time, try to avoid using any type in the process of using TS. Using this type may be tortured by the soul during the codeReview process.) At the same time, when declaring the boolean type, start with is:

do the above, in codeReview, you can maintain a confident state to accept the review of colleagues and leaders, because no low-level mistakes can keep the people viewing your code happy, and this mood can be positive for you. Feedback.

02 Each function only does one thing

Each function tries to keep its responsibilities as single as possible, and don't have a very robust function that does a lot of things:

The word And itself is not part of the function. It will cause too many business dependencies or responsibilities to be added to the current function. From a long-term perspective, this will definitely do more harm than good.

03 Keep the function "pure"

Anything outside the function, any variable is not his business, so a good function should be kept separate from any variable outside the function.

The following code may only be written by novices who are just getting started, but this messy logic is likely to be mixed into your code after the business becomes complicated:

The above example can be changed to the following:

Of course, the above problems generally no longer exist during the use of ES6, but the pure function idea needs to be kept in mind at all times.

04 Modular business logic

After you create some functions, you find that they have done some similar behaviors in the current business. For example, to verify the user name and password of the user login, then we can best classify them into a module.

Here we can call it the authentication module, and is not simply a util or server to collect it and is done:

05 Simplify conditional logic

If there are a lot of if else content in a business, it will be a headache for developers to see it.

Give a simple example:

Take a closer look at the else here is actually unnecessary, we can remove it by returning early:

06 enrich u Error log

When we browse a certain App or website, we often click on a button to pop up the prompt "An Error Occurs". This prompt is very unfriendly. We can't troubleshoot what happened, and users are even more confused. But if the description information is filled in completely when this kind of error occurs, it will have a great experience for users or technical support.

For example: when the user does not enter information in the form:

When the user has a network failure at this time:

For developers, a detailed prompt can easily locate the problem and save a lot of time:

Including but not limited to these types of error formats, and methods such as showMessage can provide...

07 Make good use of plug-ins in the editor

Students who develop under VSCode can maintain beautiful code by installing prettier. At the same time, with the help of ESLint, you can focus on formatted content such as indentation and spaces during development.

If TS is injected during the development process, enabling typescript-eslint will help you standardize your type definitions and create a rigorous code style.

With these plug-ins, our code formatting time is greatly reduced, so that we can spend more time on improving code quality.

08 Summary

The examples listed above are relatively simple. Through these easy-to-understand examples, everyone can use their own understanding in their work. That worked.

, and be meticulous in coding, which will be of great help to the growth of our technology.

Only perseverance, decades of training can witness the birth of craftsmen in the technical circle. mutual encouragement!

-END-


有道AI情报局
788 声望7.9k 粉丝