prototypeはね...死人がでるよね。
闇の魔術
自分のPCに閉じ込めておく分には、まぁ楽で良いんだけれども。
俗に言う黒魔術
const __BASE_PROTO = {
$: {
value (...child) {
// 略
return this;
}
}
}
{
Object.defineProperties(Node.prototype, __BASE_PROTO);
Object.defineProperties(Element.prototype, __BASE_PROTO);
}
function GOD(v) {
this.v = v;
// 略
};
Object.assign(GOD.prototype, Object.prototype, Array.prototype, Number.prototype, String.prototype);
ただ、後で面倒になる。
闇の魔術に対する防衛術
参考にしたライブラリはある $(dsand).$()
で、自分はこの防衛術をつかって SVGをグリグリ書いて、うりうり動かすライブラリを書いている svg.js
俗に言う白魔術
const __BASE_PROTO__ = {
// '@': elem,
'@parse' : {
value (arr) {return arr.filter(v => null != v).map(v => '@' in v ? v['@'] : v)}
},
_ : {
value () {return this['@'];},
},
has: {
value (prop) {return prop in this["@"];}
},
$: {
value(...child) {
// 略
return this;
},
},
// 略
}
const _ = function(el, custom = '') {
return Object.create(
{ '@': el },
custom instanceof Object
? Object.assign({}, __BASE_PROTO__, custom)
: __BASE_PROTO__);
};
const _tag = tag => document.createElement(tag);
const div = () => _(_tag('div'));
const p = () => _(_tag('p'));
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>foo</title>
<script src="_.js"></script>
<script>
const load = () => {
_(document.body).$(
div().$(
p().$('hello')
),
div().$(
p().$('world')
)
);
};
document.addEventListener("DOMContentLoaded", load);
</script>
</head>
<body>
</body>
</html>
bodyに追加される
<div><p>hello</p></div>
<div><p>world</p></div>