10 методов JavaScript, которые должен знать каждый разработчик!

Привет! 👋

В данной статье мы поговорим про 10 важных методов JavaScript, которые следует знать каждому разработчику!

1. toUpperCase()

Метод toUpperCase() используется для того, чтобы преобразовать все символы строки в верхний регистр. Это полезно, когда нужно работать с текстом в стандартном формате или сделать его более заметным.

Пример использования:

var str = "Lorem Ipsum is simply dummy text of the printing and typesetting industry.";
var newStr = str.toUpperCase();
console.log(newStr);

Результат:

LOREM IPSUM IS SIMPLY DUMMY TEXT OF THE PRINTING AND TYPESETTING INDUSTRY.

Таким образом, весь текст строки был преобразован в заглавные буквы.

Этот метод не изменяет исходную строку, а возвращает новую с преобразованными символами.

2. toLowerCase()

Метод toLowerCase() работает противоположно методу toUpperCase(). Он преобразует все символы строки в нижний регистр. Это удобно, когда нужно унифицировать регистр текста для сравнения или других операций.

Пример использования:

var str = "LOREM IPSUM IS SIMPLY DUMMY TEXT OF THE PRINTING AND TYPESETTING INDUSTRY.";
var newStr = str.toLowerCase();
console.log(newStr);

Результат:

lorem ipsum is simply dummy text of the printing and typesetting industry.

Этот метод также возвращает новую строку, не изменяя оригинальную.

3. trim()

Метод trim() позволяет удалить лишние пробелы в начале и в конце строки. Это полезно, когда нужно очистить пользовательский ввод или текстовые данные от ненужных пробелов.

Пример использования:

var str1 = "       JavaScript        ";
var str2 = str1.trim();
console.log(str2);

Результат:

JavaScript

Пробелы вокруг строки были удалены, а сама строка осталась неизменной. Этот метод не влияет на пробелы внутри строки — только на те, которые находятся по краям.

4. keys()

Метод Object.keys() возвращает массив, содержащий все ключи (свойства) объекта. Это удобно, когда нужно получить список всех свойств объекта для дальнейшей работы с ними.

Пример использования:

const user = {
  username: 'Alice',
  isAdmin: true,
};
console.log(Object.keys(user));

Результат:

['username', 'isAdmin']

Массив содержит все ключи объекта user, в данном случае — это 'username' и 'isAdmin'. Этот метод полезен для перебора свойств объекта или их анализа.

5. create()

Метод Object.create() позволяет создать новый объект на основе существующего. Новый объект наследует свойства и методы прототипа исходного объекта, что может быть полезно для создания объектов с похожими характеристиками.

Пример использования:

const animal = {
  species: "Dog",
  speak: function() {
    console.log(`I am a ${this.species}`);
  }
};

const myPet = Object.create(animal);
myPet.species = 'Cat';
myPet.speak();

Результат:

I am a Cat

В данном примере объект myPet был создан на основе объекта animal и унаследовал его метод speak. Мы изменили свойство species для нового объекта, и вызов метода отобразил обновленное значение.

6. freeze()

Метод Object.freeze() используется для «замораживания» объекта. Это значит, что объект становится неизменяемым: нельзя добавлять новые свойства, изменять существующие или удалять их. Такой объект остаётся неизменным, что полезно для защиты данных от случайных изменений.

Пример использования:

const car = {
  model: "Tesla",
};
Object.freeze(car);

car.model = "BMW"; // Попытка изменить свойство
console.log(car.model);

Результат:

Tesla

Несмотря на попытку изменить значение свойства model, оно остаётся прежним — "Tesla", так как объект был «заморожен» с помощью Object.freeze().

7. assign()

Метод Object.assign() используется для копирования свойств одного или нескольких объектов в целевой объект. Он изменяет целевой объект, добавляя в него свойства из других объектов. Это удобно для объединения объектов или добавления новых свойств.

Пример использования:

const user = {
  username: "Alice",
  role: "admin"
};

const additionalInfo = {
  isActive: true,
  lastLogin: "2024-10-20"
};

Object.assign(user, additionalInfo);
console.log(user);

Результат:

{ username: 'Alice', role: 'admin', isActive: true, lastLogin: '2024-10-20' }

Свойства из объекта additionalInfo были скопированы в объект user, объединяя их. Теперь объект user содержит как старые, так и новые свойства.

8. Number()

Метод Number() используется для преобразования значений различных типов данных в число. Это полезно, когда нужно работать с числовыми значениями, даже если исходные данные представлены в виде строк или логических значений.

Пример использования:

var isTrue = true;
console.log(Number(isTrue));  // 1

var isFalse = false;
console.log(Number(isFalse));  // 0

var str = "123";
console.log(Number(str));  // 123

Результат:

1
0
123

В первом случае логическое значение true преобразуется в число 1, а false — в 0. В третьем примере строка "123" была преобразована в числовое значение 123.

9. every()

Метод every() используется для проверки, удовлетворяют ли все элементы массива определённому условию. Если все элементы соответствуют этому условию, метод возвращает true; если хотя бы один элемент не удовлетворяет, возвращается false.

Пример использования:

const numbers = [12, 18, 24, 30];
function isAdult(num) {
  return num >= 18;
}
console.log(numbers.every(isAdult)); // true

Результат:

true

В этом примере все числа в массиве numbers больше или равны 18, поэтому метод every() возвращает true. Если хотя бы одно число было бы меньше 18, результат был бы false.

10. includes()

Метод includes() позволяет проверить, содержится ли определённый элемент в массиве. Если элемент найден, метод возвращает true, в противном случае — false. Это удобно для быстрого поиска значений в массивах.

Пример использования:

const fruits = ['apple', 'banana', 'orange'];
console.log(fruits.includes('banana')); // true

Результат:

true

В этом примере метод includes() проверяет, содержится ли элемент 'banana' в массиве fruits. Поскольку 'banana' присутствует в массиве, результатом будет true. Если бы мы проверяли, например, 'grape', результат был бы false.

Подводим итоги

В данной статье мы рассмотрели 10 базовых методов в JavaScript, которые помогут вам эффективно работать со строками, числами, массивами и объектами. Эти методы являются основой для выполнения различных операций и упрощают разработку, позволяя вам:

1. Проверять наличие элемента в массиве с помощью includes().
2. Преобразовывать строки в нужный регистр с помощью toUpperCase() и toLowerCase().
3. Удалять лишние пробелы в начале и конце строк с помощью trim().
4. Получать ключи объекта с помощью Object.keys().
5. Создавать объекты на основе существующих с помощью Object.create().
6. Защищать объекты от изменений с помощью Object.freeze().
7. Копировать свойства из одного объекта в другой с помощью Object.assign().
8. Преобразовывать данные в числовые значения с помощью Number().
9. Проверять, удовлетворяют ли все элементы массива определенному условию с помощью every().

Мем про JS в студию!

Наддемся, статья была полезной для вас! ✌️