Рубрики
Без рубрики

ТОП 40 методов JavaScript, которые вы должны знать !!

JavaScript – это язык программирования, используемый для создания веб -страниц и мобильных приложений. Если вы были … с меткой JavaScript, Beginters, Programming, WebDev.

JavaScript – это язык программирования, используемый для создания веб -страниц и мобильных приложений. Если вы так долго изучали JavaScript, и все же это выглядит страшно для вас, вероятно, вы еще не изучали эти методы. Эта статья для всех разработчиков JavaScript на любом уровне. Если вы ищете определенный метод, не стесняйтесь прыгать и пропустить других. Если вы знакомы с JavaScript, я рекомендую вам прочитать ES6 Современный JavaScript Чтобы узнать больше о JS.

  1. Множество
  2. Нить
  3. Объекты
  4. Числа
  5. ES6

Если вы уже знакомы с определением вышеупомянутых тем, не стесняйтесь исследовать только их методы.

Множество

Вы можете знать, что переменная может хранить только значение за раз, например, var Это совершенно нормально, и мы можем использовать его много раз при создании проекта, однако иногда требуется собирать много значений в одной переменной, например, список имен студентов, именно здесь мы можем использовать концепцию массива. Массив – это единственная переменная, которая хранит список значений, и каждый элемент указан одним индексом.

Методы массива:

  • поп ()

Метод POP () удаляет последний элемент массива.

var students = [ 'Jack', 'James', 'Robert', 'John'];
 console.log(students);
 students.pop();
 console.log(students)

Output: 
[ 'Jack', 'James', 'Robert', 'John' ]
[ 'Jack', 'James', 'Robert' ]
  • сдвиг()

Метод Shift () удаляет первый элемент из массива.

 var students = [ 'Jack', 'James', 'Robert', 'John'];
   console.log(students);
   students.shift();
   console.log(students)


Output:
[ 'Jack', 'James', 'Robert', 'John' ]
[ 'James', 'Robert', 'John' ]
  • толкать()

Метод push () добавляет один или несколько элементов к концу массива.

 var students = [ 'Jack', 'James', 'Robert', 'John'];
   console.log(students);
   students.push('Zahab', 'Kakar');
   console.log(students)


Output: 
[ 'Jack', 'James', 'Robert', 'John' ]
[ 'Jack', 'James', 'Robert', 'John', 'Zahab', 'Kakar' ]
  • unshift ()

Непрерывный метод добавляет один или несколько элементов в начало массива.

var students = [ 'Jack', 'James', 'Robert', 'John'];
   console.log(students);
   students.unshift('Zahab', 'Kakar');
   console.log(students);

Output:
[ 'Jack', 'James', 'Robert', 'John' ]
[ 'Zahab', 'Kakar', 'Jack', 'James', 'Robert', 'John' ]
  • длина

Длина возвращает количество элементов в массиве.

var students = [ 'Jack', 'James', 'Robert', 'John'];
   console.log(students);
var length = students.length;
   console.log(length)

[ 'Jack', 'James', 'Robert', 'John' ]
4
  • сплайс ()

Метод SPLICE () используется для добавления новых элементов в массив.

var students = [ 'Jack', 'James', 'Robert', 'John'];
   console.log(students);
students.splice(2, 1, "Zahab", "Kakar");
  console.log(students);

Output:
[ 'Jack', 'James', 'Robert', 'John' ]
[ 'Jack', 'James', 'Zahab', 'Kakar', 'John' ]

Как мы уже говорили, этот метод используется для добавления элементов в массив, однако, мы должны указать, что где новые элементы должны быть добавлены. В приведенном выше примере 2 указывает номер индекса, в котором должны быть размещены новые элементы, и 1 показывает количество элементов, которые должны быть удалены, как мы упомянули 1 элемент, у нас нет «Роберта» во втором массиве Анкет

  • concat ()

Метод контакта используется для создания нового массива путем объединения или объединения существующих массивов.

var students = [ 'Jack', 'James', 'Rober', 'John'];
   console.log(students);
var myFriends = ['Jennifer','Mary','Patricia']
  console.log(myFriends);

  var allNames =  students.concat(myFriends);  
  console.log(allNames)


Output:
[ 'Jack', 'James', 'Rober', 'John' ]
[ 'Jennifer', 'Mary', 'Patricia' ]
[ 'Jack', 'James', 'Rober', 'John', 'Jennifer', 'Mary', 'Patricia' ]
  • кусочек()
  1. Этот метод вырезает часть массива, начиная с упомянутого индекса элементов массива.
  2. Slice может иметь два аргумента, которые указывают на начало и до (но не включая) конечный аргумент.
  3. Этот метод также принимает отрицательные числа.
var students = [ 'Jack', 'James', 'Rober', 'John'];
   console.log(students);

 var newStudent  = students.slice(3);  
  console.log(newStudent);

Output:
[ 'Jack', 'James', 'Rober', 'John' ]
[ 'John' ]


var students = [ 'Jack', 'James', 'Rober', 'John'];
   console.log(students);

 var newStudent  = students.slice(1,3);  
  console.log(newStudent);


Output:
[ 'Jack', 'James', 'Rober', 'John' ]
[ 'James', 'Rober' ]

var students = [ 'Jack', 'James', 'Rober', 'John'];
   console.log(students);

 var newStudent  = students.slice(-1);  
  console.log(newStudent);


[ 'Jack', 'James', 'Rober', 'John' ]
[ 'John' ]

Нить

Строка JavaScript хранит серию символов, или строка – это коллекция символов. Строка может быть любым текстом внутри двойных или одиночных кавычек.

  • Touppercase ()

Метод Touppercase используется для преобразования строки в верхний регистр.

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

Output: 

LOREM IPSUM IS SIMPLY DUMMY TEXT OF THE PRINTING AND TYPESETTING INDUSTRY.
  • TOLOWERCASE ()

Защитный регистр используется для преобразования строки в нижний чехол.

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

Output:
lorem ipsum is simply dummy text of the printing and typesetting industry.
  • кусочек()

Этот метод используется для возврата нарезанной части строки, он принимает один или два аргумента, которые указывают начальный и конец среза. Аргументы также могут быть отрицательными.

var str = "lorem ipsum is simply dummy text of the printing and typesetting industry"
var newStr = str.slice(-8, -1)
console.log(newStr);


Output:

industr
  • substring ()

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

var str = "lorem ipsum is simply dummy text of the printing and typesetting industry"
var newStr = str.substring(1, 6)
console.log(newStr);


Output:

orem
  • substr ()

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

var str = "lorem ipsum is simply dummy text of the printing and typesetting industry"
var newStr = str.substr(8, 13)
console.log(newStr);

Output:

sum is simply
  • заменять()

Метод замены используется для замены части строки другой строкой. Этот метод чувствителен к случаям.

var str = "lorem ipsum is simply dummy text of the printing and typesetting industry"
var newStr = str.replace("is", "are")
console.log(newStr);


Output:

lorem ipsum are simply dummy text of the printing and typesetting industry
  • concat ()

Этот метод используется для объединения двух или более строк.

var str1 = "Java";
var str2 = "Script";

var str = str1.concat(str2);
console.log(str)

Output:
JavaScript
  • отделка()

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

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

Output:

JavaScript
  • расколоть()

Сплит используется для преобразования строки в массив.

var str = "JavaScript, is, nice"
var newStr = str.split(",")
console.log(newStr[0]);

Output:

JavaScript
  • charcodeat

Charcodeat возвращает Unicode символа в указанном индексе в строке.

var str = "JavaScript is nice"
var newStr = str.charCodeAt(str[1])
console.log(newStr);

Output:

74
  • charat ()

Этот метод возвращает символ конкретного индекса в строке.

var str = "JavaScript is nice"
var newStr = str.charAt(1)
console.log(newStr);

Output:

a
  • Padstart

Этот метод используется для добавления заполнения в начале строки.

var str = "15"
var newStr = str.padStart(4, "3")
console.log(newStr);

Output:

3315
  • нанесение

Он добавляет накладку в конце строки.

var str = "15"
var newStr = str.padEnd(4, "3")
console.log(newStr);

Output:

1533
  • длина

Этот метод используется для возврата длины строки.

var str = "JavaScript is nice."
var newStr = str.length
console.log(newStr);

Output:

19

Объекты

Объект – это тип данных JavaScript. Он используется для хранения различных ключевых коллекций, и каждый ключ может иметь значение.

  • Keys ()

Этот метод возвращает ключи объекта.

const object1 = {
  name: 'John',
  age: 20,

};

console.log(Object.keys(object1));

Output:

[ 'name', 'age' ]
  • ценности()

Этот метод возвращает значения объекта.

const object1 = {
  name: 'John',
  age: 20,

};

console.log(Object.values(object1));

Output:

[ 'John', 20 ]
  • Создайте()

Этот метод используется для создания нового объекта из существующего объекта.

const person = {
  name: "John",
  introduction: function() {
    console.log(`My name is ${this.name}`);
  }
};

const me = Object.create(person);

me.name = 'Robert'; 

me.introduction();

Output:

My name is Robert
  • заморозить ()

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

const person = {
  name: "John",

};


Object.freeze(person);

person.name = "Robert";


console.log(person.name);

Output:

John
  • назначать()

Этот метод используется для копирования свойств одного объекта в другой объект.

const person = {
  name: "John",
  age : 20
};

const obj = {
  ishuman : true
}
Object.assign(person, obj);

console.log(person);

Output:

{ name: 'John', age: 20, ishuman: true }

Числа

Число является числовым типом данных JavaScript, в котором хранится нормальные целочисленные значения с плавающей запятой.

  • toFixed ()

Этот метод записывает число с указанным количеством десятичных десятичных сетей и возвращает его значение в качестве строки.

var x = 9.656;
var newX = x.toFixed(0);
console.log(newX)
var newX = x.toFixed(2); 
console.log(newX)
var newX = x.toFixed(4);  
console.log(newX)
var newX = x.toFixed(6);  
console.log(newX)
console.log(typeof(newX))

Output:
10
9.66
9.6560
9.656000
string
  • Toprecision ()

Этот метод используется для преобразования числа в указанную точность и вернуть его значение в качестве строки.

var x = 9.656;
var newX = x.toPrecision(2);
console.log(newX)
var newX = x.toPrecision(4);  
console.log(newX)
var newX = x.toPrecision(6);  
console.log(newX)
console.log(typeof(newX))

Output:
9.7
9.656
9.65600
string
  • parsefloat ()

Этот метод сначала преобразует аргумент функции в строку и возвращает номер с плавающей точкой.

function addition(r) {
  return parseFloat(r) * 2.0;
}

console.log(addition(2))
console.log(addition("2"))
console.log(addition("3.3"))

outPut:
4
4
6.6
  • Количество()

Этот метод используется для преобразования значения других типов данных в числа.

var x = true;
console.log(Number(x))
var x = false;
console.log(Number(x))
var x = "999";
console.log(Number(x))

1
0
999
  • parseint ()

Этот метод сначала преобразует аргумент функции в строку и возвращает целое число.

function addition(r) {
  return parseInt(r) * 2.0;
}

console.log(addition(2))
console.log(addition("2"))
console.log(addition("3.3"))

Output:
4
4
6

ES6

ES6 представил много важных методов в JavaScript, которые мы обсудим в этой статье. Если вы еще не знаете ES6, я рекомендую вам взглянуть на это Статья, потому что в приведенных ниже параграфах мы использовали несколько тем, которые могут выглядеть жестко, однако они включают свое определение и пример.

  • карта()

Этот метод занимает массив и выполняет определенную функцию на каждом из элементов массива и возвращает новый массив.

var arr=[2.1,3.5,4.7]; 

var result= arr.map((num) => 2*num );  
console.log(result)

Output:

[ 4.2, 7, 9.4 ]
  • каждый()

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

const ages = [32, 33, 16, 40];


function checkAge(age) {
  return age > 18;
}

console.log(ages.every(checkAge))

Output:

false
  • включает в себя()

Этот метод используется для проверки конкретного элемента существует в массиве или нет. Он возвращает True, если элемент включает в массив.

const ages = [32, 33, 16, 40];

console.log(ages.includes(33))

Output:

true
  • для… итератора

Для … создает петлю над объектом и массивом.

const ages = [33, 32, 16];

for (const element of ages) {
  console.log(element + "b");
}


Output:

33b
32b
16b
  • Распространение оператора

Распространенный оператор используется) взять массив и расширяет его в отдельные элементы… указывает оператор спреда.

const ages = [33, 32, 16];

console.log(...ages)

Output:

33 32 16
  • фильтр()

Этот метод создает новый массив со всеми элементами, которые передают предоставленное условие.

const ages = [33, 32, 16];

console.log(ages.filter((age)=> age>20))

Output:

[ 33, 32 ]
  • уменьшать()

Этот метод используется для уменьшения массива до значения.

const ages = [33, 32, 16];

const reducer = (first, second) => first + second;


console.log(ages.reduce(reducer))


Output:

81

Это все сейчас. Спасибо за чтение, я надеюсь, что вы нашли эту статью полезной.

Не стесняйтесь общаться со мной на Twitter 🙂

Оригинал: “https://dev.to/zahab/top-40-javascript-methods-you-must-know-fj5”

Читайте ещё по теме: