In JavaScript, provided a data structure can be instantiated (with the new
keyword), it's an object - Map
Set
Array
etc.
const map = new Map();
const set = new Set('Bello');
const array = new Array(3, 5, 'Bello');
const checkMap = typeof map;
const checkSet = typeof set;
const checkArray = typeof array;
console.log(checkMap, checkSet, checkArray); // object object object
A primitive data structure can become a non-primitive data structure also.
Primitive data structures are the fundamental data structures like numbers, strings, etc.
Non-primitive data structure contains one or more primitive data (stored in a variable).
See the example below:
const numb = new Number(3)
const str = new String('Bello');
const checkNum = typeof numb;
const checkStr = typeof str;
console.log(numb, str); // [Number: 3] [String: 'Bello']
console.log(checkNum, checkStr); // object object
It is not a good practice to convert primitive data types to an object because they can lead to slow execution.
Instantiation should be avoided on primitive data types.
See the example above:
const numb = new Number(3)
const str = new String('Bello');
const checkNum = typeof numb;
const checkStr = typeof str;
console.log(numb, str); // [Number: 3] [String: 'Bello']
console.log(checkNum, checkStr); // object object
// numbers has no iterable keys and values
const iterNum = Object.keys(numb);
// strings has no iterable keys and values
const iterStr = Object.keys(str);
console.log(iterNum); // []
console.log(iterStr); // [ '0', '1', '2', '3', '4' ]
In the example above, the string to object conversion returned iterable ordered keys (indexes).
The above example shows that strings are iterable while numbers aren't.
Syntax used above is:
Object.keys(obj)
The example above is the same as below:
const str = {
0: 'B',
1: 'e',
2: 'l',
3: 'l',
4: 'o'
}
Object.keys(str); // [ '0', '1', '2', '3', '4' ]
/* Object.values(str) // [ 'B', 'e', 'l', 'l', 'o' ] */
Primitive data like string and number are convertible to objects, but not all object is iterable. For example, the number to object conversion returned an empty array,
[]
; while a string to object conversion returned iterable orderedkeys
with their respectivevalues
.
The syntax above doesn't always work - like on a map and set.
See another example below:
const map = new Map();
const set = new Set('Bello');
const array = new Array(3, 5, 'Bello');
console.log( Object.keys(set) ); // [] => doesn't work on set
console.log( Object.keys(array) ); // [ '0', '1', '2' ] => works on array
console.log( Object.keys(map) ); // [] => doesn't work on map
The Object.*
doesn't allow Map
and Set
iterable - they are iterable but in a different syntax.
The map or set objects iterable syntax is re-constructed below:
map.keys()
set.keys()
The same example above is modified. See below:
const map = new Map();
const set = new Set('Bello');
const array = new Array(3, 5, 'Bello');
console.log( set.keys() ); // { 'B', 'e', 'l', 'o' }
console.log( Object.keys(array) ); // [ '0', '1', '2' ]
console.log(map.keys()); // [Map Iterator] { }
The former syntax doesn't return an array, but the latter syntax
Object.*
returns a real array
The keys
method is not the only method used on an object for iteration. There are other methods like values
and entries
used on an object.
See the example below:
const user = {
name: "Bello",
age: 27
};
// loop over keys
console.log( Object.keys(user) ); // [ 'name', 'age' ]
// loop over values;
console.log( Object.values(user) ); // [ 'Bello', 27 ]
// loop over key-value pairs;
console.log( Object.entries(user) ); // [ [ 'name', 'Bello' ], [ 'age', 27 ] ]
Since Object.*
returns real arrays, we can access items from it.
console.log( Object.keys(user)[0] ); // name
console.log( Object.values(user)[0] ); // Bello
console.log( Object.entries(user)[0][1] ); // Bello
The example above is the same as below:
const user = {
name: "Bello",
age: 27
};
for (let key of Object.keys(user)) {
console.log(key);
/*
name
age
*/
}
for (let value of Object.values(user)) {
console.log(value);
/*
Bello
27
*/
}
for (let entry of Object.entries(user)) {
console.log(entry);
/*
[ 'name', 'Bello' ]
[ 'age', 27 ]
*/
}
The
key
value
entry
are random variable names.
Transforming objects
The methods, keys
values
entries
transform an object into an array.
The method fromEntries
converts an array to an object.
See the example below:
const user = {
name: "Bello",
age: 27
};
console.log( Object.entries(user) );
// [ [ 'name', 'Bello' ], [ 'age', 27 ] ]
const arr = Object.entries(user);
const toObj = Object.fromEntries(arr);
console.log(toObj); // { name: 'Bello', age: 27 }
Top comments (0)