Ladies and gentlemen today, we're gonna talk about the oddities in
Java skipper array
Basically real truth about what javascript arrays are as we know javascript arrays are very different than arrays in
Other programming languages like C and Java, so we're gonna look at some weird stuff like negative indexes
we're gonna look at how they are different from JavaScript objects, and we're also going to look at some performance between
object arrays and maps so in this video
We are going to go quite deep and if you want to make your fundamental strong
This is over here for you and welcome to tech see tutorials
All right, so let's start with a
Simple array you can't get any simpler than that
Now let's do something really weird. I'm going to add a
value add index minus 1 and when I give it a 0 so I'm hoping I'm hoping that
It would be something like this
1 2 & 3
If jaws keep holds a negative index, right?
so let's look at what really happens if I
console.log
Array, it only gives me 1 2 & 3. Let's look at the length
it's 3 if I do try to retrieve the value at
Index minus 1 it gives me 0 so it is saving it's not an error but somehow
It's not showing up in the array length. So what's really going on here?
So if I look at the in a browser console?
I will get the three elements 1 2 & 3
And then I would get minus 1 so I was hoping that the minus 1 will be here on the top of 0
But it's not the land is thrilled still 3. So what really going on here?
So I'll tell you what's going on this in JavaScript indexes are automatic. You cannot have a
Negative index which is true. So this is not actually
Negative index. This is a key value pair. So here I am saying minus 1 is a key and
0 as a valid similarly I can do something like this
high key equal to
high
value
Okay, and now if I look at it, it has high key and high value. So in a way they are behaving like
Objects now let's do something even more fun. I'm going to make this an empty array
and
I'm gonna have a equal to a bell and
B
Equal to
B bell and now if I look at the
array, I have you know key value pair and lenda is still 0 because I don't have
any
Regular array stuff. It's all key value pairs and
If I want to if I want to I trade through this
Usually if I have an object, I cannot really I trait to using for loop I have to use for in loop
So let's try to use for in loop to see if it works. So I'm gonna do for
let I
Let's call it key
in
All right
and
I
can console.log
Let's do template string you can do
Key
The Val just just like how we use in objects
So I get key and value pair, which is correct. So here actually
Arrays are behaving like objects. It's allowing us to add keys and values
Like objects. I'm
Allowed to do I trade through
So I can really create
objects
JavaScript objects using javascript array
the only difference is its it has
square bracket instead of curly brackets and
That is a truth about jaws key brace that they are actually underneath
Associative arrays what they call it, so there is not much difference
Trained JavaScript objects and jóska berries if I have an object
Equal to an empty array and
Then I'm going to make it look like a race so I can say object and usually arrays have
index 0 1 2 3 right, so
I'm going to create something like this
as if
Already equal to 1 2
3 if I want to create that
If I console.log
Object it looks similar to array. So if I console.log the
Array
The only difference is in the object. You will never get the length as you can see there is no length here
Compared to here I have leant
Now, let's check the performance
We already know that arrays if I want to add something at the end of it. It's pretty simple
So we are going to create a giant array and see how the hobbit how they perform compared to objects
Because we already know some of the characteristic of erase and objects. For example
If you want to add something middle of the array
You have to move all the indexes over and so they are very expensive in a way
Compared to objects it should be very easy
Because they are like maps. So let's look at for each insertion access
how they perform timewise, so let's create an array let I
equal to 0
to I less than
Let's create an array size of million elements and I and I'm gonna call it
Const a
And I'm just gonna push each value so a
equal to
And without sign value, so we are actually pushing some meaningful value inside and to check the performance we can use
Console.time and we can give it a label called a and at the end we will get
Console.time and and now if I look at the performance it's taking about
400 milliseconds on average
So if I keep checking it's about 400
380 watt close to 400 milliseconds. Okay. Let's do the same thing for object now in this case
I'm going to call this o
and we're gonna create an object with the curly brackets and I can say oh I
equal to I
Now the time that is performed it's about the same time. The insert is about the st
Arrays are 400 and objects is about
373 so not much difference
And if I keep doing it
I would get objects are always little faster to insert just to talk just a little bit faster
Okay, let me console. Aughh the
insert, and we're gonna try to insert something inside the
So we have built this giant
Arrays and objects, right? So let's try to insert something a
in mints inserting inside the array and
console dot
time and a
In so I can say a and in 50000 element I can insert let's say
50,000. Let's see how it performs. Okay. It's about
Point zero eight milliseconds. That's pretty fast. Now. Let's try to do the same thing for
Owen for object. All right, so the arrays are
Little bit slower. It's point zero 14 and
Objects are point
Zero seven in this case object. It's just a little slower
Usually objects behave a little bit faster on average. But in this case, it's a little slower
Let's try it again because the the difference is not that much
They're almost about the same objects behaves just a little faster than array
There is not much difference actually
and again
The performance of the implementation of arrays and objects might be might differ from browser to browser
I'm testing inside the chrome and
This is the result you might try in
Safari and Firefox you might get a surprise
I'm not sure but what I really like to find out which I couldn't really find out. Is that how
internally arrays and objects are implemented which data structure they are they're using because
At least I know the Chrome browser is was build a and C using C
Right, so I want to know which data structure is used to build a race if anybody knows to the answer
Let me know and anybody knows more truth than what I presented
Please let me know because this can get really interesting and I hope you enjoy this video and if you did
Please like like subscribe and hit provide a nice comment and you can also
Join my facebook group. I've created a new private group where we can discuss
similar topics so do join I'll provide a link here and you can also translate this video for me to
Your native language. It's pretty simple. The the information is in the description
Thank you