曲線上の交点X = QX2*t*t + QX1*t + QX0; としたとき

直線の始点X0 <= 曲線上の交点X <= 直線の終点X2
或いは、直線の始点X0 >= 曲線上の交点X >= 直線の終点X2

のとき、線分と曲線の交点が存在する

交点が線分上に存在するか？の判定式

    for(let t of timeCurve) { //求めたtの解（timeCurveリストに格納）それぞれについて判定
      if(0 <= t && t <= 1){  /*tの解が0 <= t <=1 のとき、直線Lineとの交点を持つ。その交点座標が線分上に存在するなら当たり！*/
        const x3 = QX2*t*t + QX1*t + QX0; //交点のX座標を求める
        const y3 = QY2*t*t + QY1*t + QY0; //交点のY座標を求める
        if (line.x === line.x2 ) {//直線のX座標が一定ならY座標判定へ
          if ( line.y <= y3 && y3 <= line.y2 || line.y2 <= y3 && y3 <= line.y ) { return true; } //Y座標が線分上にあるなら当たり！
        }
        else if ( line.x <= x3 && x3 <= line.x2 || line.x2 <= x3 && x3 <= line.x ) { return true; } //X座標が線分上にあるなら当たり！
      }
    }

⇒ ベジェ曲線と直線の当たり判定デモ3を見る

QuadraticCurveクラスを改良する

    /*２次ベジェ曲線の定数（0 <= t <= 1) の間で変化するtを用いた数式*/
    // X = (qCurve.x2 - 2*qCurve.cp1x + qCurve.x)*t*t + 2*(qCurve.cp1x - qCurve.x)*t + qCurve.x; //曲線上のX座標の値を定義
    // Y = (qCurve.y2 - 2*qCurve.cp1y + qCurve.y)*t*t + 2*(qCurve.cp1y - qCurve.y)*t + qCurve.y; //曲線上のY座標の値を定義
    //見づらいので、変数を定義してまとめる。
    const QX2 = qCurve.x2 - 2*qCurve.cp1x + qCurve.x;
    const QX1 = 2*(qCurve.cp1x - qCurve.x);
    const QX0 = qCurve.x;

    const QY2 = qCurve.y2 - 2*qCurve.cp1y + qCurve.y;
    const QY1 = 2*(qCurve.cp1y - qCurve.y);
    const QY0 = qCurve.y;

2次ベジェ曲線クラスの改良後のソースコード

class QuadraticCurve extends Collider { //当たり判定を２次ベジェ曲線で扱うクラス
  constructor(x, y, cp1x, cp1y, x2, y2, tag) {
    super('quadraticCurve', x, y, tag);
    this.x2 = x2; //終着点のx座標
    this.y2 = y2; //終着点のy座標
    this.cp1x = cp1x; //制御点1のx座標
    this.cp1y = cp1y; //制御点1のy座標

    /* 2次ベジェ曲線の方程式（0 <= t <=1) */
    // 曲線上のX座標 = fx(t) =  (this.x2 - 2*this.cp1x + this.x)*t*t + 2*(this.cp1x - this.x)*t + this.x;
    this.QX2 = this.x2 - 2*this.cp1x + this.x; // 曲線上のX座標を求める方程式のt**2の係数
    this.QX1 = 2*(this.cp1x - this.x); // 曲線上のX座標を求める方程式のt**1の係数
    this.QX0 = this.x; // 曲線上のX座標を求める方程式のt**0の係数

    // 曲線上のY座標 = fy(t) =  (this.y2 - 2*this.cp1y + this.y)*t*t + 2*(this.cp1y - this.y)*t + this.y;
    this.QY2 = this.y2 - 2*this.cp1y + this.y; // 曲線上のY座標を求める方程式のt**2の係数
    this.QY1 = 2*(this.cp1y - this.y); // 曲線上のY座標を求める方程式のt**1の係数
    this.QY0 = this.y; // 曲線上のY座標を求める方程式のt**0の係数
  }

  /* 2次ベジェ曲線の方程式（0 <= t <=1) t地点の座標を求める*/
  fx(t) { return this.QX2*t*t + this.QX1*t + this.x; }
  fy(t) { return this.QY2*t*t + this.QY1*t + this.y; }

  /* ２次曲線の微分式（0 <= t <=1) の時の、曲線の傾きを求める */
  f1x(t) { return 2*this.QX2*t + this.QX1; }
  f1y(t) { return 2*this.QY2*t + this.QY1; }

  bounceVect(t) { // tのときの曲線上の微分式から法線ベクトルを求める
    const dx = this.f1x(t), dy = this.f1y(t);
    return new Vector2D(-dy, dx); // 曲線のt地点における傾きに垂直なベクトル
  }

  get top() {  // 曲線の上端 = Yの最小値
    if(Math.min(this.y, this.cp1y, this.y2) !== this.cp1y) { //もし最小値が制御点cp1yでないなら
      return Math.min(this.y, this.y2); //始点か終点のうち、どちらか小さい方が最小値。
    }
    else { //もし最小値が制御点cp1xとなるなら、t = - (cp1y - y) / (y2 - 2cp1y + y);を曲線の式に代入してYの極値を求める
      if(this.y3 === undefined) {
        const t = - (this.cp1y - this.y) / (this.y2 - 2*this.cp1y + this.y);
        this.y3 = this.fy(t); //極値が最小値。
      }
      return this.y3;
    }
  }
  get bottom() {  // 曲線の下端 = Yの最大値
    if(Math.max(this.y, this.cp1y, this.y2) !== this.cp1y) { //もし最大値が制御点cp1yでないなら
      return Math.max(this.y, this.y2); //始点か終点のうち、どちらか大きい方が最大値。
    }
    else { //もし最大値が制御点cp1xとなるなら、t = - (cp1y - y) / (y2 - 2cp1y + y);を曲線の式に代入してYの極値を求める
      if(this.y3 === undefined) {
        const t = - (this.cp1y - this.y) / (this.y2 - 2*this.cp1y + this.y);
        this.y3 = this.fy(t); //極値が最大値。
      }
      return this.y3;
    }
  }
  get left() {  // 曲線の左端 = Xの最小値
    if(Math.min(this.x, this.cp1x, this.x2) !== this.cp1x) { //もし最小値が制御点cp1xでないなら
      return Math.min(this.x, this.x2); //始点か終点のうち、どちらか小さい方が最小値。
    }
    else { //もし最小値が制御点cp1xとなるなら、t = - (cp1x - x) / (x2 - 2cp1x + x);を曲線の式に代入してXの極値を求める
      if(this.x3 === undefined) {
        const t = - (this.cp1x - this.x) / (this.x2 - 2*this.cp1x + this.x);
        this.x3 = this.fx(t); //極値が最小値。
      }
      return this.x3;
    }
  }
  get right() {  // 曲線の右端 = Xの最大値
    if(Math.max(this.x, this.cp1x, this.x2) !== this.cp1x) { //もし最大値が制御点cp1xでないなら
      return Math.max(this.x, this.x2); //始点か終点のうち、どちらか大きい方が最大値。
    }
    else { //もし最大値が制御点cp1xとなるなら、t = - (cp1x - x) / (x2 - 2cp1x + x);を曲線の式に代入してXの極値を求める
      if(this.x3 === undefined) {
        const t = - (this.cp1x - this.x) / (this.x2 - 2*this.cp1x + this.x);
        this.x3 = this.fx(t); //極値が最大値。
      }
      return this.x3;
    }
  }
  get aabbRect() {  // 曲線と接するaabb矩形
    return new Rectangle( this.left, this.top, this.right - this.left, this.bottom - this.top);
  }
}

２次ベジェ曲線と矩形の当たり判定

  deRectQCurve(rect, qCurve) { //矩形と2次ベジェ曲線の衝突判定式
    if( !this.deRectRect(rect, qCurve.aabbRect) ) {return false;} //矩形と2次曲線のaabb矩形を判定して、falseならfalseを返して終了
    const timeCurve = []; //tの解で交点になる答えを格納（このオブジェクトの値を判定式で返す）

    if( this.deRectPoint(rect, qCurve.x, qCurve.y) ) { timeCurve.push(0); return timeCurve; } //矩形と2次曲線の始点を判定、trueなら当たり。
    if( this.deRectPoint(rect, qCurve.x2, qCurve.y2) ) { timeCurve.push(1); return timeCurve;} //矩形と2次曲線の終点を判定、trueなら当たり。

    /*２次ベジェ曲線の定数（0 <= t <= 1) の間で変化するtを用いた数式*/
    // X = QX2*t*t + QX1*t + QX0; //曲線上のX座標の値を定義
    // Y = QY2*t*t + QY1*t + QY0; //曲線上のY座標の値を定義

    /*
    // 矩形の線分式1   X = rect.left; （Y >= rect.top, Y <= rect.bottom)
    // 矩形の線分式2   X = rect.right; （Y >= rect.top, Y <= rect.bottom)
    // 矩形の線分式3   Y = rect.top; （X >= rect.left, X <= rect.right)
    // 矩形の線分式4   Y = rect.bottom; （X >= rect.left, X <= rect.right)
    */

    // それぞれの矩形の式に、XやYを当てはめる。tの解について4回の判定をする
    // tの2次方程式ができる。
    /*
    // 矩形の線分式1との判定  QX2*t*t + QX1*t + QX0 - rect.left = 0; （Y >= rect.top, Y <= rect.bottom, 0 <= t <= 1)
    // 矩形の線分式2との判定  QX2*t*t + QX1*t + QX0 - rect.right = 0; （Y >= rect.top, Y <= rect.bottom, 0 <= t <= 1)
    // 矩形の線分式3との判定  QY2*t*t + QY1*t + QY0 - rect.top = 0; （X >= rect.left, X <= rect.right, 0 <= t <= 1)
    // 矩形の線分式4との判定  QY2*t*t + QY1*t + QY0 - rect.bottom = 0; （X >= rect.left, X <= rect.right, 0 <= t <= 1)
    */

    // tについて解く。
    //解の公式を使うために、a*t*t + b*t + c = 0;の形に整理し、定数a,b,cの値を定義する。

    // 矩形の線分式1,2,3,4のtの解を求める定数abcのオブジェクトを、配列に格納する。
    const abc = [
        {a: qCurve.QX2, b: qCurve.QX1, c: qCurve.QX0 - rect.left} ,
        {a: qCurve.QX2, b: qCurve.QX1, c: qCurve.QX0 - rect.right} ,
        {a: qCurve.QY2, b: qCurve.QY1, c: qCurve.QY0 - rect.top} ,
        {a: qCurve.QY2, b: qCurve.QY1, c: qCurve.QY0 - rect.bottom}
    ];

    for(let i of abc) { //4辺それぞれの交点について、判定する。
        const delta = i.b*i.b - 4*i.a*i.c;
        const timeCurveCheck = []; //求めたtの解をチェックする配列
        if (delta === 0) { timeCurveCheck.push( -i.b/(2*i.a) ); }
        else if (delta > 0) {
            timeCurveCheck.push( (-i.b + Math.sqrt(delta))/(2*i.a) );
            timeCurveCheck.push( (-i.b - Math.sqrt(delta))/(2*i.a) );
        }
        for(let t of timeCurveCheck) { //tの解が交点であるかチェック
            if(0 <= t && t <= 1){
                if(i.b == qCurve.QX1) { const y3 = qCurve.fy(t); //tがX座標についての方程式の解なら、tを代入したY座標を調べる
                    if( rect.top <= y3 && y3 <= rect.bottom) { timeCurve.push(t);} //Y座標が線分の範囲なら判定OKリストに追加
                }
                else { const x3 = qCurve.fx(t); //tがY座標についての方程式の解なら、tを代入したX座標を調べる、
                    if( rect.left <= x3 && x3 <= rect.right) { timeCurve.push(t);} //X座標が線分の範囲なら判定OKリストに追加
                }
            }
        }
    }

    if(timeCurve.length > 0) { return timeCurve; } // 交点（判定OK）となるtの解をリストで渡す（判定true)
    else {return false;} // もし解が無ければ、false判定。
  }

⇒ ベジェ曲線とキャラクター（矩形）の当たり判定デモを見る

２次ベジェ曲線にぶつかった時のバウンス判定

２次曲線上の交点となるtが得られた時の法線ベクトルは？

当たった位置の法線は、二次ベジェ曲線の式をtで微分して接線を求め変形する。

x' = 2*(qCurve.x2 - 2*qCurve.cp1x + qCurve.x)*t + 2*(qCurve.cp1x - qCurve.x);
y' = 2*(qCurve.y2 - 2*qCurve.cp1y + qCurve.y)*t + 2*(qCurve.cp1y - qCurve.y);

法線ベクトル = (-y', x')

当たり判定式で求めた解「t」を、この関数でも使いたい

tの解を返す２次曲線と線分の衝突判定式

  deLineQCurve(line, qCurve) { //線分と2次ベジェ曲線の衝突判定式
    if( !this.deRectLine(qCurve.aabbRect, line) ) {return false;} //2次曲線のaabb矩形と直線を判定して、falseならfalseを返して終了
    //解の公式を使うために、a*t*t + b*t + c = 0;の形に整理し、定数a,b,cの値を定義する。

    const a = line.dy* qCurve.QX2 - line.dx* qCurve.QY2;
    const b = line.dy* qCurve.QX1 - line.dx* qCurve.QY1;
    const c = line.dy* qCurve.QX0 - line.dx* qCurve.QY0 + line.dx*line.y - line.dy*line.x;

    //解の公式 t = (-b ± Math.sqrt(b*b - 4*a*c))/(2*a)
    //解の公式を用いて2次方程式の定数tの値（２つある）を得る判定
    const delta = b*b - 4*a*c; //Math.sqrt(b*b - 4*a*c))の中身を判定
    const timeCurveCheck = []; //求めたtの解をチェックする配列

    if (delta < 0) {return false;} //delta が負に値になるとき、解はない。交点が存在しない
    else if (delta === 0) { //delta=0 のとき、tの解は1つ。timeCurveCheckリストにtの解を一つ追加する
      timeCurveCheck.push( -b/(2*a) );  //tの解 = -b/(2*a)
    } 
    else if (delta > 0) { //delta>0 のとき、tの解は2つ。timeCurveCheckリストにtの解を二つ追加する
      timeCurveCheck.push( (-b + Math.sqrt(delta))/(2*a) );  //tの解1つめ = -b + Math.sqrt(delta))/(2*a)
      timeCurveCheck.push( (-b - Math.sqrt(delta))/(2*a) );  //tの解2つめ = -b - Math.sqrt(delta))/(2*a)
    }

    const timeCurve = []; //tの解で交点となるtの解答リスト
    for(let t of timeCurveCheck) { //求めたtの解（timeCurveCheckリストに格納）それぞれについて判定
        if(0 <= t && t <= 1){  /*tの解が0 <= t <=1 のとき、直線Lineとの交点を持つ。tを曲線上の式に代入した座標が線分上に存在するなら当たり！*/
            if (line.x === line.x2 ) { const y3 = qCurve.fy(t); //交点のY座標を求める、直線のX座標が一定ならY座標判定へ
                if ( line.y <= y3 && y3 <= line.y2 || line.y2 <= y3 && y3 <= line.y ) { timeCurve.push(t); } //Y座標が線分上にあるなら交点座標となるtを解答リストに追加！
            }
            else { const x3 = qCurve.fx(t); //交点のX座標を求める
                if ( line.x <= x3 && x3 <= line.x2 || line.x2 <= x3 && x3 <= line.x ) { timeCurve.push(t); } //X座標が線分上にあるなら交点座標となるtを解答リストに追加！
            }
        }
    }
    if(timeCurve.length > 0) { return timeCurve; } // 交点（判定OK）となるtの解をリストで渡す（判定true)
    else {return false;} // もし解が無ければ、false判定。
  }

Sceneクラスにて、Hit判定式=true時の関数を見直す

Sceneクラスの_hitTest()内にて

  const hit = this._detector.detectCollision(collider1, collider2);

  if(hit) {
     obj1.dispatchEvent('hit', new GameEvent(obj2));
     obj2.dispatchEvent('hit', new GameEvent(obj1));
  }

  const hit = this._detector.detectCollision(collider1, collider2);

  if(hit) {
     obj1.dispatchEvent('hit', new GameEvent(obj2, hit));
     obj2.dispatchEvent('hit', new GameEvent(obj1, hit));
  }

GameEventクラスについて、見直し

GameEventクラスに2つ目の要素を追加する

class GameEvent {//dispatchEventにて、addEventListenerに登録した関数に値を渡す役割
    constructor(target, info) {
        this.target = target;
        this.info = info; 
    }
}

アクターと２次曲線との反動ベクトルを求める準備が整いました

2次曲線との衝突判定にて反動ベクトルを考える

• 求まったt値のリストより、法線の単位ベクトルを求める。
• 後はラインとの衝突処理と同じ感覚で、アクターのspeedに単位ベクトルをかけて、X軸Y軸の移動距離に反映させる

得られたtの値から法線ベクトルを求め、バウンド処理をする

得られたtの値を平均値でとる

複数あるtの解を合計値で取得

const tArray = e.info; //tの解のリストが格納された配列
const tSum = tArray.reduce((a, c) => a + c);

tの合計値をArray.lengthで割って、平均値を出す

const t = tSum / tArray.length; // tの解の平均値を得る、このtから法線ベクトルを求める

得られたtの平均値から法線ベクトルを求める

当たった位置の法線は、二次ベジェ曲線の式をtで微分して接線を求め変形する。

x' = 2*(qCurve.x2 - 2*qCurve.cp1x + qCurve.x)*t + 2*(qCurve.cp1x - qCurve.x);
y' = 2*(qCurve.y2 - 2*qCurve.cp1y + qCurve.y)*t + 2*(qCurve.cp1y - qCurve.y);

法線ベクトル = (-y', x')

えーっｔ，うちの定義に当て嵌めて実践してみるか。

法線ベクトルを求める下書き

const dx = - y' = - 2*(qCurve.y2 - 2*qCurve.cp1y + qCurve.y)*t - 2*(qCurve.cp1y - qCurve.y);
const dy = x' = 2*(qCurve.x2 - 2*qCurve.cp1x + qCurve.x)*t + 2*(qCurve.cp1x - qCurve.x);

const bounceVect = new Vector2D (dx, dy);

うーん、これは2次曲線クラス（Collider）の方で、すぐ取り出せるように関数化しておいたほうが良さそうですね。

QuadraticCurveクラスにメソッドを追加

  bounceVect(t) { // tのときの曲線上の点から法線ベクトルを求める
    const dx = - 2* this.QY2*t - this.QY1;
    const dy = 2* this.QX2*t + this.QX1;
    return new Vector2D(dx, dy);
  }

というのを登録しておくと、法線ベクトルが必要なhit判定時に...

const bounceVect = other.bounceVect(t).normalVect;

という感じで、衝突相手の2次曲線を示す変数と、定義したtの値から法線ベクトル（今回は単位ベクトルで）を呼び出すことができます。

交点と、自分の座標の位置関係を調べる

さてこの法線ベクトルですが、正でとるか負でとるか、悩ましい感じです。 うーん、ここはtの交点を求めて、自分との位置関係をベクトルで表してみようと思います。

const otherCx = other.fx(t), otherCy = other.fy(t); // 曲線上のバウンドの起点となるXとYの座標を求める 
const delta = new Vector2D (this.hitArea.cx - otherCx, this.hitArea.cy - otherCy); //バウンドの起点から自分の中心点までのベクトルで、お互いの位置関係を取得

あとは、法線ベクトルと位置関係deltaのベクトルを内積で判定して、正の値ならそのままだし、食い違ってたら法線ベクトルはマイナスでとる感じになるでしょう。

if(bounceVect.innerP(delta) < 0) {bounceVect.dx*=-1; bounceVect.dy*=-1;}

ここまで来れば簡単です。後はラインのときと同じように、このアクターの速さ分だけ単位ベクトルの方向に移動させればOK

if ( this.speed*this.speed < this.vector.length2 ) { speed = this.vector.length; } //もし自分の移動ベクトルが（押し戻しなどの影響で）自分の速度より大きくなってるなら、移動ベクトルの大きさを反動の大きさとする。
this._velocityX += speed * bounceVect.dx; //X軸の反動の大きさを反映
this._velocityY += speed * bounceVect.dy; //Y軸の反動の大きさを反映

⇒ ベジェ曲線とキャラクター（矩形）のバウンス判定デモを見る

後日のプログラム改良

３次曲線のコードを組んでる最中に、２次方程式の解の公式に、改善点が見つかりました。
1次の係数が2の倍数になってると、より簡略化した解の式が得られます。

⇒ ２次方程式の解の公式二つ目

1次のtの係数を2の倍数にして定義すると？

  fx(t) { return this.QX2*t*t + 2*this.QX1*t + this.x; }
  fy(t) { return this.QY2*t*t + 2*this.QY1*t + this.y; }

こうすると、解の公式が簡略化出来そう...

2次曲線クラス（Collider）のコード改良後

class QuadraticCurve extends Collider { //当たり判定を２次曲線で扱うクラス、物体の放物線の軌道だったり力場を作ったりする。
  constructor(x, y, x1, y1, x2, y2, tag) {
    super('quadraticCurve', x, y, tag);
    this.x1 = x1; //制御点1のx座標
    this.y1 = y1; //制御点1のy座標
    this.x2 = x2; //終着点のx座標
    this.y2 = y2; //終着点のy座標
  }
  // 曲線上のX座標 = fx(t) =  (this.x2 - 2*this.x1 + this.x)*t*t + 2*(this.x1 - this.x)*t + this.x;
  // 曲線上のY座標 = fy(t) =  (this.y2 - 2*this.y1 + this.y)*t*t + 2*(this.y1 - this.y)*t + this.y;

  get QX2() { return this.x2 - 2*this.x1 + this.x; } // 曲線上のX座標を求める方程式のt**2の係数
  get QX1() { return this.x1 - this.x; } // 曲線上のX座標を求める方程式のt**1の係数の半分...使う時は2*QX1として使う。
  get QY2() { return this.y2 - 2*this.y1 + this.y; } // 曲線上のY座標を求める方程式のt**2の係数
  get QY1() { return this.y1 - this.y; } // 曲線上のY座標を求める方程式のt**1の係数の1/2...使う時は2*QY1として使う。

  /* 2次ベジェ曲線の方程式（0 <= t <=1) t地点の座標を求める*/
  fx(t) { return this.QX2*t*t + 2*this.QX1*t + this.x; }
  fy(t) { return this.QY2*t*t + 2*this.QY1*t + this.y; }

  /* ２次曲線の微分式（0 <= t <=1) の時の、曲線の傾きを求める */
  f1x(t) { return 2*(this.QX2*t + this.QX1); }
  f1y(t) { return 2*(this.QY2*t + this.QY1); }

//〜〜

数式をこのように定義し直す。すると。。。

直線と２次曲線との交点を求める数式が簡略化する

  deLineQCurve(line, qCurve) { //線分と2次ベジェ曲線の衝突判定式
    if( !this.deRectLine(qCurve.aabbRect, line) ) {return false;} //2次曲線のaabb矩形と直線を判定して、falseならfalseを返して終了

    //解の公式を使うために、a*t*t + 2*b*t + c = 0;の形に整理し、定数a,b,cの値を定義する。
    const a = line.dy* qCurve.QX2 - line.dx* qCurve.QY2;
    const b = line.dy* qCurve.QX1 - line.dx* qCurve.QY1;
    const c = line.dy* qCurve.x - line.dx* qCurve.y + line.dx*line.y - line.dy*line.x;

    //解の公式Ⅱ  t = (-b ± Math.sqrt(b*b - a*c))/a
    //解の公式Ⅱを用いて2次方程式の定数tの値（２つある）を得る判定
    const delta = b*b - a*c; //Math.sqrt(b*b - a*c))の中身を判定
    const timeCurveCheck = []; //求めたtの解をチェックする配列

    if (delta < 0) {return false;} //delta が負に値になるとき、解はない。交点が存在しない
    else if (delta === 0) { //delta=0 のとき、tの解は1つ。timeCurveCheckリストにtの解を一つ追加する
        timeCurveCheck.push( -b/a );  //tの解 = -b/a
    } 
    else if (delta > 0) { //delta>0 のとき、tの解は2つ。timeCurveCheckリストにtの解を二つ追加する
        const sqrtDelta = Math.sqrt(delta);
        timeCurveCheck.push( (-b + sqrtDelta)/a );  //tの解1つめ = -b + Math.sqrt(delta))/a
        timeCurveCheck.push( (-b - sqrtDelta)/a );  //tの解2つめ = -b - Math.sqrt(delta))/a
    }

    const timeCurve = []; //tの解で交点となるtの解答リスト
    for(let t of timeCurveCheck) { //求めたtの解（timeCurveCheckリストに格納）それぞれについて判定
        if(0 <= t && t <= 1){  /*tの解が0 <= t <=1 のとき、直線Lineとの交点を持つ。tを曲線上の式に代入した座標が線分上に存在するなら当たり！*/
            if (line.x === line.x1 ) { const y3 = qCurve.fy(t); //交点のY座標を求める、直線のX座標が一定ならY座標判定へ
                if ( line.y <= y3 && y3 <= line.y1 || line.y1 <= y3 && y3 <= line.y ) { timeCurve.push(t); } //Y座標が線分上にあるなら交点座標となるtを解答リストに追加！
            }
            else { const x3 = qCurve.fx(t); //交点のX座標を求める
                if ( line.x <= x3 && x3 <= line.x1 || line.x1 <= x3 && x3 <= line.x ) { timeCurve.push(t); } //X座標が線分上にあるなら交点座標となるtを解答リストに追加！
            }
        }
    }
    if(timeCurve.length > 0) { return timeCurve; } // 交点（判定OK）となるtの解をリストで渡す（判定true)
    else {return false;} // もし解が無ければ、false判定。
  }

tの解を求める計算途中、余計な割り算掛け算を省けます(' '*)♪。
矩形との判定も同様に改良して、いい感じになりそうですね。


では、ここからさらに発展して、より実用的な３次曲線の当たり判定に入っていきます！（コスト大きいので注意） ⇒ JavaScriptでゲーム作り「１０EX：３次曲線の当たり判定」


古都さんのフレームワークを元にほぼ最初から作ってます。
たぶん順番に見ないとちんぷんかんぷん(' '*)...

すぺしゃるさんくす

https://sbfl.net/

古都さん
JavaScriptで作る弾幕STGの基礎（フレームワーク）を使わせていただいてます。感謝！



ぴぽやさんもありがとう、キャラチップをお借りしています。