第6讲：增修别人的函数库，以pixi.js库中的Rectangle模块为例。-CSDN博客

本文链接：https://blog.csdn.net/Xeon_CC/article/details/140419754

如果发现别人的函数库缺少了某个功能，希望自己添加，那么可以这么做：
在src/lib目录下新建一个RecUtils.ts文件
内容如下：

import {Rectangle} from "pixi.js";

declare module "pixi.js"{
    class Rectangle{
        containsRect(other: Rectangle): boolean;
    }
}

Rectangle.prototype.containsRect = function(other: Rectangle){
    return (
        other.x >= this.x && other.y >= this.y && other.right <= this.right && other.bottom <= this.bottom
    )
}

在src目录下新建一个AddChangFunction.ts

import {Point, Rectangle} from  "pixi.js";
import './lib/RectUtils.ts'

let rect = new Rectangle(0,1,98,99);
let smallRect = new Rectangle(10,11,20,21);
console.log(rect.x);  // 左上角的x = 0
console.log(rect.y);  // 左上角的y = 1
console.log(rect.right); // 右下角x = 98
console.log(rect.bottom); // 右下角y = 99

let res = rect.containsRect(smallRect);
console.log(res);

修改index.html文件，修改引用为AddChangeFunction.ts文件。

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Vite + TS</title>
  </head>
  <body>
    <div id="app"></div>
    <!-- <script type="module" src="/src/main.ts"></script> -->
    <!-- <script type="module" src="/src/CanvasAndStage.ts"></script> -->
    <script type="module" src="/src/AddChangeFunction.ts"></script>
  </body>
</html>