0 added
0 removed
Original
2026-01-01
Modified
2026-03-10
1
<p>Теги: javascript, программирование на javascript, js, лайфкахи</p>
1
<p>Теги: javascript, программирование на javascript, js, лайфкахи</p>
2
<p>Предлагаем вам ознакомиться с парочкой небольших, но полезных приёмов программирования на JavaScript. Они сделают код надёжнее и упростят вашу жизнь.</p>
2
<p>Предлагаем вам ознакомиться с парочкой небольших, но полезных приёмов программирования на JavaScript. Они сделают код надёжнее и упростят вашу жизнь.</p>
3
<h2>О безопасности типов</h2>
3
<h2>О безопасности типов</h2>
4
<p>Как вы знаете, JavaScript нельзя назвать статически типизированным языком. Зато можно прибегнуть к маленькой хитрости, позволяющей сделать код надёжнее. Речь идёт о том, чтобы пометить аргументы функции как необходимые. Например, код ниже выдаёт ошибку каждый раз, когда нужное значение не передано. Тут следует учесть, что этот приём не работает для нулевых значений, зато отлично защищает от undefined-значений:</p>
4
<p>Как вы знаете, JavaScript нельзя назвать статически типизированным языком. Зато можно прибегнуть к маленькой хитрости, позволяющей сделать код надёжнее. Речь идёт о том, чтобы пометить аргументы функции как необходимые. Например, код ниже выдаёт ошибку каждый раз, когда нужное значение не передано. Тут следует учесть, что этот приём не работает для нулевых значений, зато отлично защищает от undefined-значений:</p>
5
const req = name => { throw new Error(`The value ${name} is required.`); }; const doStuff = ( stuff = req('stuff') ) => { ... }<h2>Вычисляем условия короткого замыкания (Short-circuit)</h2>
5
const req = name => { throw new Error(`The value ${name} is required.`); }; const doStuff = ( stuff = req('stuff') ) => { ... }<h2>Вычисляем условия короткого замыкания (Short-circuit)</h2>
6
<p>Условия короткого замыкания хорошо известны и полезны, если мы говорим о доступе ко значениям во вложенных объектах.</p>
6
<p>Условия короткого замыкания хорошо известны и полезны, если мы говорим о доступе ко значениям во вложенных объектах.</p>
7
const getUserCity = user => user && user.address && user.address.city; const user = { address: { city: "San Francisco" } }; // Вернёт "San Francisco" getUserCity(user); // Оба вернут undefined getUserCity({}); getUserCity();<p>Вычислять короткое замыкание полезно для предоставления альтернативного значения, когда значение является ложным:</p>
7
const getUserCity = user => user && user.address && user.address.city; const user = { address: { city: "San Francisco" } }; // Вернёт "San Francisco" getUserCity(user); // Оба вернут undefined getUserCity({}); getUserCity();<p>Вычислять короткое замыкание полезно для предоставления альтернативного значения, когда значение является ложным:</p>
8
const userCity = getUserCity(user) || "Detroit";<h2>Bang bang!!</h2>
8
const userCity = getUserCity(user) || "Detroit";<h2>Bang bang!!</h2>
9
<p>Отрицать значения дважды - это прекрасный способ сделать логическим любое значение. Однако учтите, что каждое ложное значение преобразуется в false, и это не всегда то, что вам нужно. Но не стоит применять это для чисел, ведь 0 тоже будет преобразован в false.</p>
9
<p>Отрицать значения дважды - это прекрасный способ сделать логическим любое значение. Однако учтите, что каждое ложное значение преобразуется в false, и это не всегда то, что вам нужно. Но не стоит применять это для чисел, ведь 0 тоже будет преобразован в false.</p>
10
const shouldShowTooltip = text => !!text; // Вернёт true shouldShowTooltip('JavaScript rocks'); // Все вернут false shouldShowTooltip(''); shouldShowTooltip(null); shouldShowTooltip();<h2>Выполняем отладку с логированием на месте</h2>
10
const shouldShowTooltip = text => !!text; // Вернёт true shouldShowTooltip('JavaScript rocks'); // Все вернут false shouldShowTooltip(''); shouldShowTooltip(null); shouldShowTooltip();<h2>Выполняем отладку с логированием на месте</h2>
11
<p>Вы можете применять короткое замыкание и учитывать, что результат console.log не подойдёт для отладки функционального кода, даже включая React-компоненты:</p>
11
<p>Вы можете применять короткое замыкание и учитывать, что результат console.log не подойдёт для отладки функционального кода, даже включая React-компоненты:</p>
12
const add = (a, b) => console.log('add', a, b) || (a + b); const User = ({email, name}) => ( <div> <Email value={console.log('email', email) || email} /> <Name value={console.log('name', name) || name} /> <div/> );<p><em><a>Источник</a></em></p>
12
const add = (a, b) => console.log('add', a, b) || (a + b); const User = ({email, name}) => ( <div> <Email value={console.log('email', email) || email} /> <Name value={console.log('name', name) || name} /> <div/> );<p><em><a>Источник</a></em></p>
13
13