Кто не любит магию! Кто не хочет хлопков. Все делают. Пусть Javascript поможет нам творить чудеса самостоятельно.
Вы готовы? Давайте сделаем абракадабру…
Хорошо, первый. Знаете ли вы, что абракадабра - это палиндром? О, ты пробовал это проверить. Нет, извините! :).
Это больше похоже на комедию. Давайте сделаем то, что сказано в названии.
Я хочу, чтобы вы открыли консоль разработчика рядом с этой статьей и были готовы сделать копипаст. Вы увидите много чего, что поразит вас. Если вы уже знаете некоторые уловки, то, jusss. .shhhhh ..
Давай начнем…
Примечание. Я обновлю объяснения позже, а может быть, и нет. Хотелось бы увидеть, как некоторые из вас пишут объяснения в комментариях.
1. Обмен переменной без использования временной переменной в одну строку.
let a = 1;
let b = 2;
console.log(`a is ${a} and b is ${b}`);
[a, b] = [b, a]; // abracadabra
console.log(`a is ${a} and b is ${b}`);
Скопируйте приведенный выше код и вставьте в консоль.
В следующий раз, когда вам предложат поменять местами переменную, просто выполните команду abracadabra. Не ограничиваясь двумя переменными, вы можете обменивать любое количество таких переменных.
[b, d, c, a] = [a, b, c, d];
Итак, синтаксис, используемый в abracadabra, - это уничтожение объекта.
2. Удалите из массива все ложные значения.
var myFalsyArray = [0, false, undefined, 2, "Ankur", null]; // abracadabra var noFalsyValue = myFalsyArray.map(item => item).filter(Boolean); console.log(noFalsyValue);
Скопируйте приведенный выше код и вставьте в консоль.
Boolean, да, даже класс Javascript выполняет фильтрацию за вас. Как? Дай мне знать.
3. Можете ли вы создать пустой объект {}?
Все просто, правда? {} .. Хм, неа!
var emptyObj = {};
Теперь сделаем абракадабру.
var realEmptyObject = Object.create(null); // abracadabra
Скопируйте и вставьте приведенный выше бла-бла-бла… ..
В следующий раз, когда кто-то объявит пустой объект, бросьте им вызов :)
4. Настоящая мощь методов document.getElementsBy * !!
Скопируйте и вставьте закрашенный код один за другим.
// abracadabra var collection = document.getElementsByClassName(“collection”); console.log(collection.length);// It will print 0
Очевидно, что когда вы пытаетесь получить элемент с именем класса «collection», ничего не будет возвращено, но магия уже была сделана.
Скопируйте приведенный ниже код и вставьте в консоль. :) Это создаст элемент для вас. Копировать вставку можно несколько раз.
var element = document.createElement(“p”); element.className = “collection”; document.body.appendChild(element);
Теперь
console.log(collection.length); // Prints 1
Помните, что мы объявили переменную «collection» перед добавлением новых элементов и никогда не трогали и не переназначали значения коллекции. Магия была на первом месте. Это называется живой коллекцией JavaScript. Теперь вы можете прочитать об этом больше и увидеть, какие преимущества он может принести.
Хватит магии! Комментируйте свои собственные волшебные отрывки и хлопайте в ладоши, если вам нравятся галочки.
Поделитесь магией и позвольте миру сделать больше АБРАКАДАБРА ..!
