Здравствуйте, меня зовут Дмитрий Карловский и я.. не прощаю ошибок. Как только вижу оную - тут же бросаю что-нибудь исключительно тяжёлое. И как же тяжела работа программиста на JS...
class Foo extends Object {
get name(){ return 'Jin' }
}
const foo = new Foo
`Здравствуйте, ${ foo }!`
// "Здравствуйте [object Object]!"
`В этом месяце вы заработали ${ foo / 1000 } тысяч рублей.`
// "В этом месяце вы заработали NaN тысяч рублей."
`Ваша цель "${ 'foo'[4] }" наконец-то достигнута.`
// "Ваша цель "undefined" наконец-то достигнута."
`Осталось ещё ${ foo.length - 1 } целей и вы достигнете успеха.`
// "Осталось ещё NaN целей и вы достигнете успеха."
foo.__proto__= { name: 'придурок' };
`До скорых встреч, ${ foo.name }.`
// "До скорых встречь, придурок."
Облегчить его страдания можно разными путями..
Прикрыться тайпскриптом. Но в рантайме ноги всё равно остаются босыми, и на них кто-нибудь вечно наступает.
Обложиться проверками. Но чуть замешкаешься и рантайм грабли тут же бьют по голове.
Исправить JS. Даже не надейтесь.
Исправить JS рантайм. Ну, давайте подумаем..
Проблемы с динамической типизацией JS возникают по 3 основным причинам:
Автоматическое (и порой неуместное) приведение типов, когда значение одного типа используется в контексте, предназначенном для другого, вместо сообщения об ошибке.
Возврат undefined в качестве значения не объявленных полей вместо сообщения об ошибке.
Случайное или злонамеренное изменение всего прототипа, при установке значения одного поля, вместо изменения только этого поля.
Сначала разберёмся с первой проблемой. JS устроен так, что приведение примитивных типов мы никак исправить не сможем. А вот за приведением объектов у нас есть полный контроль. Поэтому давайте пропатчим глобальный прототип всех объектов, чтобы никакие объекты по умолчанию не допускали приведения типов:
Object.prototype[ Symbol.toPrimitive ] = function() {
throw new TypeError( `Field Symbol(Symbol.toPrimitive) is not defined` )
}
Теперь, чтобы разрешить приведение типа, нужно переопределить метод Symbol.toPrimitive у нужного объекта.
Ладно, с первой проблемой разобрались. Но как-то она далась нам подозрительно легко... Что-то тут не так! Не похоже это на Веб.. Ну да ладно, пошли к следующей.
Тут нам нужно как-то перехватывать обращения к произвольным полям объекта, даже если они ещё никак не были объявлены. В JS для этого есть только один механизм - прокси. Что ж, напишем такой прокси который при обращении к любому полю громко ругается квазицензурными словами:
export let $mol_strict_object = new Proxy( {}, {
get( obj: object, field: PropertyKey, proxy: object ) {
const name = JSON.stringify( String( field ) )
throw new TypeError( `Field ${ name } is not defined` )
},
})
К сожалению, поменять prototype у Object, как мы это сделали ранее, браузер нам уже не даст. Как и поменять прототип у Object.prototype - он всегда будет null. Зато мы можем менять прототипы у почти всех остальных стандартных классов унаследованных от Object:
Поэтому пройдёмся по всем глобальным переменным:
for( const name of Reflect.ownKeys( $ ) ) {
// ...
}
Отсеем те из них, кто не является классами:
const func = Reflect.getOwnPropertyDescriptor( globalThis, name )!.value
if( typeof func !== 'function' ) continue
if(!( 'prototype' in func )) continue
Обратите внимание, что мы не используем globalThis[name] для получения значения, чтобы не триггерить ненужные варнинги.
Теперь оставляем лишь те классы, что непосредственно унаследованы от Object:
const proto = func.prototype
if( Reflect.getPrototypeOf( proto ) !== Object.prototype ) continue
И, наконец, подменяем прототип прототипа с Object.prototype на наш строгий вариант:
Reflect.setPrototypeOf( proto, $mol_strict_object )
Теперь почти все стандартные объекты будут смотреть на вас с укоризной, при обращении к свойству, которому не задано значение. Ведь если значение задано, то браузер не пойдёт по цепочке прототипов и не дойдёт до нашего прокси.
К сожалению, есть и исключения, такие как сам Object, все объектные литералы и всё, что унаследовано от EventTarget, который тоже не дают менять.
И тут CSSStyleDeclaration делает нам подножку: если подменить его прототип на прокси (даже прозрачный, не кидающий исключений), то, внезапно, в Хроме 89 он перестаёт синхронизироваться с атрибутом style dom-элемента:
Поэтому его пока что приходится вносить в исключения.
Есть и ещё одна беда.. Если объявлять прикладные классы так:
class Foo {}
То объекты этих классов не будут строгими. Но если объявить их так:
class Foo extends Object {}
То.. ничего особо не изменится. Но вот если подменить глобальный объект Object на свой строгий подкласс:
globalThis.Object = function $mol_strict_object( this: object, arg: any ) {
let res = Object_orig.call( this, arg )
return this instanceof $mol_strict_object ? this : res
}
Reflect.setPrototypeOf( Object, Reflect.getPrototypeOf({}) )
Reflect.setPrototypeOf( Object.prototype, $mol_strict_object )
То прикладные классы, явно унаследованные от Object, станут строгими.
Что ж, попарились на славу, другое дело. Последняя же проблема решается снова просто - удаляем геттер и сеттер для свойства __proto__ в результате чего, оно перестанет менять прототип объекта, а будет самым обычным полем, как и все остальные:
delete Object.prototype.__proto__
Однако, подчеркну, что если вы используете deep merge или deep compare, то в них необходимо проверять, что поле является собственным и игнорировать все остальные:
Иначе через такие стандартные свойства любого объекта, как contructor, toLocaleString и другие, можно будет дойти чуть ли не до любого объекта в приложении, что является лишним при работе с POJO.
Итак, что у нас получилось...
class Foo extends Object {
get name(){ return 'Jin' }
}
const foo = new Foo
`Здравствуйте, ${ foo }!`
// TypeError: Field "Symbol(Symbol.toPrimitive)" is not defined
`В этом месяце вы заработали ${ foo / 1000 } тысяч рублей.`
// TypeError: Field "Symbol(Symbol.toPrimitive)" is not defined
`Ваша цель "${ 'foo'[4] }" наконец-то достигнута.`
// TypeError: Field "4" is not defined
`Осталось ещё ${ foo.length - 1 } целей и вы достигнете успеха.`
// TypeError: Field "length" is not defined
foo.__proto__= { name: 'придурок' };
`До скорых встреч, ${ foo.name }.`
// "До скорых встречь, Jin."
На случай, если это будут читать дети, подчеркну:
Не меняйте поведение рантайма в библиотеках, ибо таким образом вы можете сломать кому-нибудь приложение. А вот для запуска тестов лучше использовать как раз максимально строгий рантайм - мало ли использовать вашу библиотеку будут именно в нём.
https://page.hyoo.ru/#!=obks59_yspl3j
Здравствуйте, меня зовут Дмитрий Карловский и я.. не прощаю ошибок. Как только вижу оную - тут же бросаю что-нибудь исключительно тяжёлое. И как же тяжела работа программиста на JS...
Облегчить его страдания можно разными путями..
Проблемы с динамической типизацией JS возникают по 3 основным причинам:
Сначала разберёмся с первой проблемой. JS устроен так, что приведение примитивных типов мы никак исправить не сможем. А вот за приведением объектов у нас есть полный контроль. Поэтому давайте пропатчим глобальный прототип всех объектов, чтобы никакие объекты по умолчанию не допускали приведения типов:
Теперь, чтобы разрешить приведение типа, нужно переопределить метод
Symbol.toPrimitive
у нужного объекта.Ладно, с первой проблемой разобрались. Но как-то она далась нам подозрительно легко... Что-то тут не так! Не похоже это на Веб.. Ну да ладно, пошли к следующей.
Тут нам нужно как-то перехватывать обращения к произвольным полям объекта, даже если они ещё никак не были объявлены. В JS для этого есть только один механизм - прокси. Что ж, напишем такой прокси который при обращении к любому полю громко ругается квазицензурными словами:
К сожалению, поменять
prototype
уObject
, как мы это сделали ранее, браузер нам уже не даст. Как и поменять прототип уObject.prototype
- он всегда будетnull
. Зато мы можем менять прототипы у почти всех остальных стандартных классов унаследованных отObject
:Поэтому пройдёмся по всем глобальным переменным:
Отсеем те из них, кто не является классами:
Обратите внимание, что мы не используем
globalThis[name]
для получения значения, чтобы не триггерить ненужные варнинги.Теперь оставляем лишь те классы, что непосредственно унаследованы от
Object
:И, наконец, подменяем прототип прототипа с
Object.prototype
на наш строгий вариант:Теперь почти все стандартные объекты будут смотреть на вас с укоризной, при обращении к свойству, которому не задано значение. Ведь если значение задано, то браузер не пойдёт по цепочке прототипов и не дойдёт до нашего прокси.
К сожалению, есть и исключения, такие как сам Object, все объектные литералы и всё, что унаследовано от EventTarget, который тоже не дают менять.
И тут
CSSStyleDeclaration
делает нам подножку: если подменить его прототип на прокси (даже прозрачный, не кидающий исключений), то, внезапно, в Хроме 89 он перестаёт синхронизироваться с атрибутомstyle
dom-элемента:Поэтому его пока что приходится вносить в исключения.
Есть и ещё одна беда.. Если объявлять прикладные классы так:
То объекты этих классов не будут строгими. Но если объявить их так:
То.. ничего особо не изменится. Но вот если подменить глобальный объект
Object
на свой строгий подкласс:То прикладные классы, явно унаследованные от
Object
, станут строгими.Что ж, попарились на славу, другое дело. Последняя же проблема решается снова просто - удаляем геттер и сеттер для свойства
__proto__
в результате чего, оно перестанет менять прототип объекта, а будет самым обычным полем, как и все остальные:Однако, подчеркну, что если вы используете deep merge или deep compare, то в них необходимо проверять, что поле является собственным и игнорировать все остальные:
Иначе через такие стандартные свойства любого объекта, как
contructor
,toLocaleString
и другие, можно будет дойти чуть ли не до любого объекта в приложении, что является лишним при работе с POJO.Итак, что у нас получилось...
На случай, если это будут читать дети, подчеркну:
Не меняйте поведение рантайма в библиотеках, ибо таким образом вы можете сломать кому-нибудь приложение. А вот для запуска тестов лучше использовать как раз максимально строгий рантайм - мало ли использовать вашу библиотеку будут именно в нём.
Если хотите лучше понять как всё это работает, то гляньте эту статью: Насколько JavaScript сильный?.
Полные исходники можно найти тут: $mol_strict.
Для подключения к своему NPM проекту достаточно прописать где-нибудь в начале точки входа:
Или:
Другие независимые сборки микробиблиотек из $mol можно найти тут: $mol: Usage from NPM ecosystem.
А если хотите обсудить подноготную JS рантайма, то присоединяйтесь к этим чатам:
Наконец, в Твиттере _jinnin можно обнаружить много свежих мыслей на тему фронтенда, JS, UX и прочей дичи.