На самом деле не всё, описанное ниже является ошибками, но если вы будете разбираться с описанными ниже проблемами, то значительно продвинетесь в изучении программирования.
\n\n\n\n\n\n\n\nЭта одна из самых распространенных ошибок, которую каждый программист делал хотя бы один раз в своей карьере. Давайте посмотрим на код ниже. Но это и не ошибка в общем-то, просто настоятельная рекомендация.
\n\n\n\nlet foo = 0;\nlet boo = 0;\nif (foo === 0) {\n boo = 1;\n} else {\n boo = 2;\n}\nКод выше выглядит правильным, так? Так и есть, но есть кое что ещё, что мы можем с ним сделать. Теперь посмотрите дальше:
\n\n\n\nlet foo = 0;\nlet boo = 0;\n\nif (!foo) {\n boo = 1;\n} else {\n boo = 2;\n}Выглядит получше? По факту, нам не нужно проверять 0, как на false значение. Мы можем просто проверить в условии !foo, отдаёт ли оно false. Давайте посмотрим на верные и неверные значения в JavaScript:
// false значения в JavaScript\nundefined --> \"undefined\" отдаст true, если является строкой\nnull --> \"null\" тоже что и \"undefined\"\n0 --> \"0\" тоже что и \"undefined\"\nfalse --> \"false\" тоже что и \"undefined\"\nNaN --> \"NaN\" тоже что и \"undefined\"\n'' or \"\" --> пустая строка\n// true значения в JavaScript\n\"String\" --> Любая строка\n[] --> Пустой массив\n{} --> Пустой объект\nfunction() {} --> Пустая функцияКаждый программист использовал if условие хотя бы раз в жизни, но в местах где не очень много сложной логики внутри условий, мы можем просто заменить их тернарным оператором.
Зачем? Чтобы избежать писанины 😉 и конечно для удобной читабельности. Давайте посмотрим на тот же пример повыше и сделаем его с использованием тернарного оператора.
\n\n\n\nlet foo = 0;\nlet boo = 0;\n!foo ? boo = 1 : boo = 2;\n// и ещё лучше\nboo = !foo ? 1 : 2;В коде выше, вместо пяти строчек кода, мы просто воспроизвели ту же логику в одной строчке. Давайте посмотрим на другой кусок кода.
\n\n\n\nif (любое условие) {\n ----------------\n что-то тут происходит\n ----------------\n return foo ? true : false;\n}С кодом выше все правильно, но вам нужно просто в данном случае постараться избегать тернарного оператора. Как? Посмотрите на код ниже.
\n\n\n\nif (любое условие) {\n ----------------\n что-то тут происходит\n ----------------\nreturn foo; // если вы уверены, что foo это булево значение\nreturn !!foo; // если foo может быть чем угодно, но не им\n}И так, выше мы видим, что нам не всегда нужен тернарный оператор и не всегда нужно стараться использовать их во вложенном виде.
\n\n\n\nДавайте внимательно посмотрим на код, чтобы лучше его понять.
\n\n\n\nif (false == 0) {\n return true;\n} else {\n return false;\n}\nif (false === 0) {\n return true;\n} else {\n return false;\n}Оба условия вернут true? Извините, что расстрою вас, но первое условие вернет true, а второе вернет false. Что же это за магия такая? Разница в обоих случаях в одном ‘=’, которое всё меняет в значительной степени. ‘==’ делает проверку на равенство с приведением типов, а ‘===’ смотрит на строгое соответствие.
Прибавление и связывание зависят от типа данных пока мы явно не укажем переменные с типом данных в JavaScript.
\n\n\n\nvar a = 10;\nvar b = '20';\nvar c = 30;\nreturn a + b; // отдаст \"1020\"\nreturn b + c; // отдаст \"2030\"\nreturn a + c; // отдаст 40\nКак мы видим на примере выше, если мы попытаемся прибавить строку к целому числу, то это возвратит связанную строку, но в случае с двумя целыми числами вернется сумма обоих.
\n\n\n\nЕсть определенные кейсы, в которых нам нужно использовать переменные как ключи. Давайте посмотрим на пример ниже.
\n\n\n\nconst a = 1;\nlet b = '';\nif(a) {\n b = 'first Name';\n} else {\n b = 'Last Name';\n}\nconst myObject = {\n b : 'Emily'\n};\nreturn myObject;В примере выше мы хотели вернуть объект как { 'first Name' : 'Emily' }, но что возвращает код это { b: 'Emily' } из-за того, что b используется как ключ. Чтобы решить эту проблему, мы используем квадратные скобки [].
if(a) {\n b = 'first Name';\n} else {\n b = 'Last Name';\n}\nconst myObject = {\n [b] : 'Emily'\n};\nreturn myObject;Теперь код возвращает то, что мы хотели — { 'first Name' : 'Emily' }
На самом деле не всё, описанное ниже является ошибками, но если вы будете разбираться с описанными ниже проблемами, то значительно продвинетесь в изучении программирования.
\n","featured_media":{"source_url":"https://stasonmars.ru/wp/wp-content/uploads/2021/01/fjdnfkjsnkjlfbsdjhkbsjkhfbdsjfb.jpg"},"interesting":[{"title":"Промисы в JavaScript для чайников","slug":"promisy-v-javascript-dlya-chainikov","type":"js"},{"title":"useEffect(fn, []) это не новый componentDidMount()","slug":"useeffect-eto-ne-novyi-componentdidmount","type":"js"},{"title":"Интересные нововведения в JavaScript ES2021","slug":"interesnie-novovvedeniya-v-javascript-es2021","type":"js"}]}},"staticQueryHashes":["3576131997","63159454"]}