tannakaken 2023-02-28 07:18:45

[TypeScript] 関数呼び出すたびに毎回prototypeを設定すんの?

投稿者からのアピールポイント

多分、ググって出てきたJavaScriptのコードをprototypeが何かを一切理解せずにコピペしたんだろうね。

JavaScriptに関する理解も皆無ならTypeScriptに関する理解があるわけなく、「これで動くはずなのになんでfillVerticalTextがないなんていうんだろ?」と思って@ts-ignoreしたんだろうね。

こういう時はせめて「ここを参考にした」とか「よく理解せずに書いてる」とかコメント書いたらどうなんだろう。

少し落ち着いて考えて「ctxを引数にとる関数fillVerticalText(ctx: CanvasRenderingContext2D, ...)を作ればいいじゃん」と気づくの、そんなに難しいことじゃないと思う。

自分の使ってる道具について理解してから使えとは言わない(それは多分誰にもできない)けど、せめて「ちゃんと理解したい」という思いの伝わるコードを書きたいものだね。

これを書いた人も、これをレビューしたことにして右から左へ流した人もみんなどこかで元気に働いているみたいだが、その職場に何事もないことを願うよ。

  1. declare const CanvasRenderingContext2D: any;

  2.  

  3. export class SomeComponent {

  4. // angularのComponentに関する設定

  5.  

  6. verticallyRotatedText(text) {

  7. CanvasRenderingContext2D.prototype.fillVerticalText = function (text, x, y, verticalSpacing) {

  8. for (var i = 0; i < text.length; i++) {

  9. if (text[i].charCodeAt(0) == 12540) {

  10. this.fillText('|', x, y + i * verticalSpacing);

  11. } else {

  12. this.fillText(text[i], x, y + i * verticalSpacing);

  13. }

  14. }

  15. };

  16. let canvas = document.createElement('canvas');

  17. // canvasに関する設定

  18. let ctx = canvas.getContext('2d');

  19. // ctxに関する設定

  20. //@ts-ignore

  21. ctx.fillVerticalText(text, 20, 20, 40);

  22. return canvas.toDataURL();

  23. }

  24. }

使い方ヒント: 「これは臭う」という行を見付けたら、各行のsmellをクリックしてマーキングしておきましょう(要Twitter OAuth認証)

コメント

まだコメントがありません。最初にコメントを残しませんか?

コメント投稿には、twitter認証が必要です。

Twitter認証