再见干净的代码

已经很晚了。

我的同事刚刚将代码编写了他已经工作了一周的存储库。 然后，我们制作了一个图形编辑器，并在最新的代码中实现了在工作区域中更改形状的功能。 可以通过移动位于其边缘的小标记来修改形状（例如，矩形和椭圆形）。

该代码有效。

但是有许多相同类型的重复结构。 每个形状（如相同的矩形或椭圆形）都有一组不同的标记。 沿不同方向移动这些标记会以不同方式影响图形的位置和大小。 如果用户在移动标记的同时按住Shift键，则在更改图形大小时，我们还必须保留图形的比例。 通常，代码中有很多计算。

有问题的代码如下所示：

let Rectangle = {
  resizeTopLeft(position, size, preserveAspect, dx, dy) {
    // 10   
  },
  resizeTopRight(position, size, preserveAspect, dx, dy) {
    // 10   
  },
  resizeBottomLeft(position, size, preserveAspect, dx, dy) {
    // 10   
  },
  resizeBottomRight(position, size, preserveAspect, dx, dy) {
    // 10   
  },
};

let Oval = {
  resizeLeft(position, size, preserveAspect, dx, dy) {
    // 10   
  },
  resizeRight(position, size, preserveAspect, dx, dy) {
    // 10   
  },
  resizeTop(position, size, preserveAspect, dx, dy) {
    // 10   
  },
  resizeBottom(position, size, preserveAspect, dx, dy) {
    // 10   
  },
};

let Header = {
  resizeLeft(position, size, preserveAspect, dx, dy) {
    // 10   
  },
  resizeRight(position, size, preserveAspect, dx, dy) {
    // 10   
  },  
}

let TextBlock = {
  resizeTopLeft(position, size, preserveAspect, dx, dy) {
    // 10   
  },
  resizeTopRight(position, size, preserveAspect, dx, dy) {
    // 10   
  },
  resizeBottomLeft(position, size, preserveAspect, dx, dy) {
    // 10   
  },
  resizeBottomRight(position, size, preserveAspect, dx, dy) {
    // 10   
  },
};

, , .

.

, . , Oval.resizeLeft() , , Header.resizeLeft(). , , .

, . , Oval.resizeLeft() Oval. — . Rectangle, Header TextBlock, .

.

, - . — :

let Directions = {
  top(...) {
    // 5   
  },
  left(...) {
    // 5   
  },
  bottom(...) {
    // 5   
  },
  right(...) {
    // 5   
  },
};

let Shapes = {
  Oval(...) {
    // 5   
  },
  Rectangle(...) {
    // 5   
  },
}

, :

let {top, bottom, left, right} = Directions;

function createHandle(directions) {
  // 20  
}

let fourCorners = [
  createHandle([top, left]),
  createHandle([top, right]),
  createHandle([bottom, left]),
  createHandle([bottom, right]),
];
let fourSides = [
  createHandle([top]),
  createHandle([left]),
  createHandle([right]),
  createHandle([bottom]),
];
let twoSides = [
  createHandle([left]),
  createHandle([right]),
];

function createBox(shape, handles) {
  // 20  
}

let Rectangle = createBox(Shapes.Rectangle, fourCorners);
let Oval = createBox(Shapes.Oval, fourSides);
let Header = createBox(Shapes.Rectangle, twoSides);
let TextBox = createBox(Shapes.Rectangle, fourCorners);

, , , . ! . , , , , .

( ). master , , «» .

… , .

, . . — . .

, , .

—

« » — , . , - , . , , , .

, , , . , . . , , : « , ». , .

, , . , , , . . . - , — , . , «».

, «», , , :

• -, , . , . ( ), — . . — .
• -, . . . , . . «» .

, «» ? . , «» «». - ? - , , ? , , ? , ?

, , . , — , , , .

— . , , , . , , , , . , . .

. . — . — - , . , , , , . 

. — .

! « »?