Ако търсите решение за съхраняване на вашите двойки ключ-стойност, като настройки и данни за търсене, тогава речникът на JavaScript е правилният избор за вас!

Речникът е структура от данни, която съхранява данни в двойки ключ-стойност. Използва се за съхраняване и ефективно извличане на данни. Речникът на JavaScript ви позволява да съхранявате и извличате данни с помощта на двойки ключ-стойност.

За разлика от масивите, които съхраняват данни в линеен ред, речниците в JavaScript ви позволяват да осъществявате достъп до данни, като използвате уникален ключ, а не индекс. Това прави речниците идеални за съхраняване на данни, които трябва да са достъпни бързо и лесно, като потребителска база данни или списък с продукти.

В тази публикация в блога ще проучим следното:

  • Създайте речник по три различни начина
  • Добавете двойки ключ-стойност към речника
  • Актуализиране на стойност за ключ
  • Достъп до елементи от речника
  • Итериране на речник с три различни подхода
  • Вземете всички ключове на речника
  • Вземете всички стойности от речник
  • Вземете дължината на ключовете на речника
  • Проверете дали съществува ключ в речника
  • Изтриване на елемент от речника

Нека се потопим дълбоко.

Създаване на речник в JavaScript

За разлика от други строго типизирани езици за програмиране като C# и Java, JavaScript няма собствен тип речник на данни. Въпреки това можем да създадем персонализирани типове речник на JavaScript обекти. Речникът ви позволява да съхранявате данни във формат ключ-стойност.

Има няколко начина за създаване на речник в JavaScript. В тази публикация в блога ще видим три различни подхода:

1. Използване на нотацията на буквалния обект

Използването на обектен литерал е най-често срещаният и прост начин за създаване на речник. Можете да създадете празен речник, като използвате { } или можете да добавите двойки ключ-стойност към него, като използвате синтаксиса на обектния литерал.

Ето пример за речник на JavaScript:

const languages = {
  'EN': 'English',
  'ES': 'Spanish',
  'TA': 'Tamil'
}
console.log(languages)
// Output: { EN: 'English', ES: 'Spanish', TA: 'Tamil' }

2. Използване на обекта Map().

Map() е един от „непримитивните типове данни в JavaScript“. С помощта на обекта Map() можете да създадете речник, който може да съдържа всякакъв тип стойност. Можете да създадете празна карта, като използвате new Map(). Можете да добавите двойки ключ-стойност към картата, като използвате метода set().

Например, създайте речник с помощта на обекта Map().

const languages = new Map()
languages.set('EN', 'English');
languages.set('ES', 'Spanish');
languages.set('TA', 'Tamil');

Не само с JavaScript низове, можете да използвате всеки тип като стойност в речника, както е показано в следния пример:

// Empty dictionary object 
let lookupData = {}

// Dictionary with single key-value pair 
let name = { "name": "John Doe" }

// Dictionary with multiple key-value pairs 
let person = { "name": "John Doe", "age": 25 }

// Dictionary with numeric keys 
let days = { 1: "Monday", 2: "Tuesday", 3: "Wednesday" }

// Dictionary with boolean values 
let status = { "isActive": true, "hasAccess": false }

// Nested dictionary object 
let people = { "person": { "name": "John Doe", "age": 25 } }

// Dictionary with array as value 
let fruits = { "fruits": ["apple", "banana", "orange"] }

// Dictionary with function as value
let functions = { "calculate": function (a, b) { return a + b; } }

// Dictionary with undefined and null values 
let edgeCases = { "name": undefined, "age": null }

3. Използване на метода Object.create().

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

Например:

let languages = Object.create({});
languages.EN = 'English';
languages.ES = 'Spanish';
languages.TA = 'Tamil';
console.log(languages)

Въпреки че можем да създаваме речници на JavaScript по различни начини, следвах първия начин за създаване на речник в тази статия. Нека проучим различните методи на речника на JavaScript, за да го манипулираме.

Бих препоръчал да следвате същия и последователен начин за създаване на речник в кода на приложението.

Добавяне на двойка ключ-стойност към речник

И така, речникът е създаден; нека да видим как да добавяме, модифицираме и премахваме двойки ключ-стойност от речника. Ключовите имена трябва да са уникални в речника. Разбира се, имената на ключовете са чувствителни към регистъра.

Можете да добавяте елементи към речник, като използвате нотацията в квадратни скоби. Можете да използвате метода set(), ако сте създали своя речник с помощта на метода Map().

Например, следният пример показва как да добавите нова двойка ключ-стойност, използвайки нотация в скоби:

const languages = {
  'EN': 'English',
  'ES': 'Spanish',
  'TA': 'Tamil'
}

languages['FR'] = 'French'
console.log(languages)

// Output: {EN: 'English', ES: 'Spanish', TA: 'Tamil', FR: 'French'}

Можете да използвате и следните означения с точка, за да добавите двойка ключ-стойност:

Актуализиране на стойността на речников ключ

Можете да актуализирате стойността в речник, като използвате метода с квадратни скоби или точка. Например:

const languages = {
  'EN': 'English',
  'ES': 'Spanish',
  'TA': 'Tamil'
}

languages['EN'] = 'English (US)'
console.log(languages)
// Output: { EN: 'English (US)', ES: 'Spanish', TA: 'Tamil' }

В този пример стойността „English“ се актуализира със стойността „English (US)“ с помощта на уникалния ключ „EN“.

Достъп до речникови елементи в JavaScript

Можете да получите достъп до съхранени в речника двойки ключ-стойност, като използвате нотацията с квадратни скоби, метода get() (ако е създаден с помощта на метода Map()), цикъла for...in или цикъла for...of.

Следният речников обект се използва за показване на примера за итерация на речника:

const languages = {
  'EN': 'English',
  'ES': 'Spanish',
  'TA': 'Tamil'
}

// Read dictionary value using key
console.log(languages['ES'])
// Output: "Spanish"

Можете да използвате следните методи и свойства на речника на JavaScript, за да манипулирате обектите на речника.

Итериране на речник

Тъй като речникът е изграден с обекти, можем бързо да преминаваме през неговите ключове. Има много начини за итерация върху обекта на речника. Всеки метод има свой собствен набор от предимства и недостатъци.

В този раздел ще разгледаме три метода за итерация през речников обект.

1. Използване на цикъла for...in

Това е един от най-често срещаните и лесни начини за повторение на речник. Позволява ви достъп до ключовете на речника един по един. Ето пример как да използвате for цикъл в речник, за да получите ключа и стойността:

for (let key in languages) {
  console.log(`${key}=${languages[key]}`);
}
// Output: 
EN=English
ES=Spanish
TA=Tamil

2. Използване на цикъла for...of

Object.entries() е един от методите на обекта. Използването на този метод заедно с цикъла for...of ви позволява да получите достъп до стойностите на речника като масив. Например:

for (let key of Object.entries(languages)) {
  console.log(key);
}

// Output: 
[ 'EN', 'English' ]
[ 'ES', 'Spanish' ]
[ 'TA', 'Tamil' ]

3. Използване на метода entries().

for (let [key, value] of Object.entries(languages)) {
  console.log(`${key}=${value}`);
}

// Output: 
EN=English
ES=Spanish
TA=Tamil

Вземете всички ключове на речника и отпечатайте

Ключовете са основното средство за достъп до стойности в обект на речник на JavaScript. Ключовете на речника могат да бъдат от всякакъв тип JavaScript, включително низове, числа и символи.

Ето пример как да създадете речников обект с низови ключове:

const languages = {
  'EN': 'English',
  'ES': 'Spanish',
  'TA': 'Tamil'
}

console.log(Object.keys(languages))
// Output: ["EN", "ES", "TA"]

В този пример клавишите са „EN“, „ES“ и „TA“. Съответните стойности са „английски“, „испански“ и „тамилски“ за тези ключове. С помощта на метода JavaScript Object.keys() можете да получите достъп до всички ключове на речника.

Вземете всички стойности на речника

За да извлечете стойностите на обект от речник на JavaScript, можете да използвате метода Object.values(). Този метод връща стойности като масив.

Ето един пример:

const languages = {
    'EN': 'English',
    'ES': 'Spanish',
    'TA': 'Tamil'
}

console.log(Object.values(languages));
// Output: [ 'English', 'Spanish', 'Tamil' ]

Размер или дължина на речника на JavaScript

const languages = {
  'EN': 'English',
  'ES': 'Spanish',
  'TA': 'Tamil'
}

console.log(Object.keys(languages).length)
// Output: 3

В този пример методът Object.keys() връща масив от ключовете в обекта на речника („EN“, „ES“ и „TA“). Свойството дължина на този масив се използва за определяне на дължината на обекта на речника. В този случай има три ключа, така че дължината е 3.

Речникът за проверка на JavaScript съдържа ключ

За да проверите дали ключът е в обекта на речника, можете да използвате методите include() или hasOwnProperty(). Ето пример за използване на include():

const languages = {
  'EN': 'English',
  'ES': 'Spanish',
  'TA': 'Tamil'
}

console.log(Object.keys(languages).includes('EN'));
// Output: true

console.log(Object.keys(languages).includes('en'));
// Output: false

В този пример методът Object.keys() ще върне ключовете на речника като масив. Можете да използвате метода JavaScript includes(), за да проверите дали ключовете ‘EN’ съществуват в обекта на речника.

В JavaScript стойностите на низовете са чувствителни към малки и големи букви. Така че търсенето с речниковия ключ „en“ връща false, защото действителният ключ е с главни букви.

Има два начина за търсене в ключовете на речника без значение на главните и главните букви. Преобразувайте клавишите и текста за търсене в малки букви на JavaScript или преобразувайте ключовете и текста в главни букви на JavaScript преди търсене.

JavaScript речник: вземете стойност по ключ

За да извлечете стойността, свързана с конкретен ключ в обект на речник на JavaScript, можете да използвате нотацията в скоби или метода get(). Ето пример с използване на нотацията в скоби:

const languages = {
  'EN': 'English',
  'ES': 'Spanish',
  'TA': 'Tamil'
}

console.log(languages['EN']);
// Output: "English"

console.log(languages.EN);
// Output: "English"

Речникът на JavaScript изтрива ключ

Операторът delete може да се използва за премахване на двойка ключ-стойност от обект на речник на JavaScript.

Ето пример как да използвате оператора за изтриване:

const languages = {
    'EN': 'English',
    'ES': 'Spanish',
    'TA': 'Tamil'
}

delete languages['TA']
console.log(Object.values(languages));
// Output: [ 'English', 'Spanish' ]

В този пример тамилският език е изтрит от речника с помощта на ключа „TA“. Ако отпечатаме обекта на речника „езици“, той ще отпечата останалите двойки ключ-стойност.

Заключение

В заключение, JavaScript няма собствен тип данни на речника. Въпреки това можем да създаваме обекти от речника на JavaScript. Структурата на речниковите данни ви позволява да съхранявате и извличате данни с помощта на двойки ключ-стойност. Те са особено полезни, когато имате нужда от бързо достъпни данни.

Разгледахме как да създадем речник и да добавим или променим стойностите на речника. Има множество методи за повторение на речник. Можете да използвате цикъла for...in, цикъла for...of и методите Object.entries().

Можете да проверите дължината на речника, като преброите неговите ключове. С помощта на метода array includes() можете да проверите дали ключът вече съществува в речник. Операторът за изтриване на JavaScript може да ви помогне да премахнете двойка ключ-стойност от речников обект.

Как смятате да използвате обекта на речника на JavaScript?

[Публикувано от www.rajamsr.com]