Scenario 1: You take old code and build on it. It is too difficult to extend existing code. At this point, you need to modify and refactor the original code before developing it. Pain ~ ~ ~.

  • Version 1.0: Get user information based on userId
/ / A development
function getUserInfo(userId) {}

/ / B development
function getUserInfo({ userId }) {
  let { userId } = data;
}
Copy the code
  • Version 2.0: Get user information based on userId and croPID
/ / A development
function getUserInfo(userId, cropid) {}

/ / B development
function getUserInfo(data) {
  let { userId, cropid } = data;
}
Copy the code

If you look closely, the above code doesn’t look very different. But notice the change in parameter passing. Both versions can fulfill existing requirements. But what if version 3 requires additional parameters? According to the idea of A development, we should continue to add. Implicit in this is a necessary condition: “parameter order”. However, the development idea of B development is only to add attributes to the pass parameter object. It is a function inside which the value of an object can be quickly obtained by destructuring assignment.

Which code base do you want to iterate on version 4? I think most people would prefer to iterate on the code developed by B.

Here are a few more pieces of code:

// B code: nested multiple layers [more than 2 layers] if
if(a>0) {if(b<0) {if(c==0) {... }}}/ / code:
Copy the code

In both cases, readability and extensibility are compromised. I think who encountered will say: F U C K!

So what should we do to avoid a remote greeting?

1. Give yourself and others some leeway

Scenario 1: Function parameters, more than two, using objects.

function getUserInfo(data) {
  let { userId, cropid } = data;
}
Copy the code

Scenario 2: Multiple judgments, using short-circuit operators

if(hasUser&&hasToken){
  ...
}

if(hsaRole||hasToken){
  ...
}

Copy the code

Scenario 3: Use map or object mapping to determine multiple scenarios

let userInfo = {
  user1: {
    age: 20,},user2: {
    age: 25,}};let getUserAge = (username) = > userInfo[username].age;
let age = getUserAge("user1");
console.log("age", age);
Copy the code

Scenario 4: Flexible use of string concatenation similar to function calls

class Fun {
  fun1() {
    console.log("fun1 log");
  }
  fun2() {
    console.log("fun2 log"); }}let key = 1;
let targetfun = `fun${key}`;
console.log("targetfun", targetfun);
let fn = new Fun(); //fun1
fn[targetfun](); //fun1 log
Copy the code

Note: This function call, in vUE development [new object is this] very useful. Especially component encapsulation and form item validation. You can save a lot of redundant code.

2. Code submission precautions

2.1 Individual development branch Periodically synchronizes the overall development branch. Local merge resolves conflicts before personal branch merges into general development branch. If multiple people modify the same file, the conflict is not easy to solve, and it is not simply “subject to me”. That way, someone will definitely ask after you.

2.2 When developing code, ensure the “normal operation” of self-negative parts. If you need to reference the code developed by others and find any problem, you will give priority to the responsible person of the corresponding module for modification. Don’t feel good about yourself.

To be continued…