👔TouchList+ext

🚧 under construction -> Object+ArrayLike

browser ⟩ event ⟩ type ⟩ touch ⟩ TouchList extension

extend TouchList with custom methods.

💾 程式

• replit ⟩ tap screen , require ⟩ Object+arrayLike

// 2023.01.17 - 08:24 (+) Object + array-like
// 2023.01.16 - 22:44 (•) first draft
// -------------------------------------------------------

import { } from './Object+ArrayLike.js';   // 👔 Object + array-like

// ⭐ TouchList extension
// ------------------------
// 🔹 .toString()
//
Object.defineProperties(TouchList.prototype, {
    // 🔹 .toString()
    toString: {
        value: function() {
            return '[' + this
                // 👔 Object + array-like
                .map(({pageX: x, pageY: y}) => `(${x}, ${y})`)
                .join(', ') + ']';
        },
    }
});

// ⭐ export
export {};        // ES module

👥 相關

• TouchList is an array-like object.

⬇️ 應用

• touch event - log event.touches points.

📗 參考

• Eloquent JS ⟩ Ch. 15: Event Handling ⟩ Touch Events ⭐️

📘 手冊

• Event ⟩ UIEvent ⟩ TouchEvent ⟩

  • .touches (TouchList)

  • .targetTouches (TouchList) - subset of the touches list

History

0

// 2023.01.16 - 22:44 - first version
// -------------------------------------------------------

// ⭐ TouchList extension
// ------------------------
// 🔹 .toString()
//
Object.defineProperties(TouchList.prototype, {
    // 🔹 .toString()
    toString: {
        value: function() {
            let points = [];
            for(let i = 0; i < this.length; i++) {
                const {pageX: x, pageY: y} = this.item(i);
                points.push(`(${x}, ${y})`);
            }
            return `[${points.join(', ')}]`;
        },
    }
});

// ⭐ export
export {};        // ES module