I Tried to Rebuild Array.pop()... Then JavaScript Humbled Me( Learning journal #2-Reference)

Mahin Ahmed — Thu, 09 Jul 2026 09:54:20 +0000

It's been 12 days since I started learning JavaScript and it made me a bit annoyed already 😅. I learned about array after completing iteration and loops. So I thought of a little challenge; Why not try to reverse engineer some of array's built-in methods?

I started with reverse engineering array.push() method. My thought process was:

we need to get the max index of the array

we need to add 1 with the max index to get new max index

then we declare a variable with the new max index

then we put a value inside that variable which is then stored to the array Thought of this way because non-existing index returns undefined, so variable not declared or emty value

So basically I was trying to get the last index of an array and then adding another index and assigning a value to it.

// push method

let array = [1,  2,  3,  4,  5];
//    Index: 0,  1,  2,  3,  4

function addElementToArray(arrayName, elementName){
  // const arrayMaxIndex = arrayName.length - 1; 
  // const newMaxIndex = arrayMaxIndex + 1
  // Those lines were unneccessary
  const newMaxIndex = arrayName.length
  arrayName[newMaxIndex] = elementName;
}

I was confident that I can do some more. So I immediately tried to reverse engineer the array.pop() method. And this is where I literary sucked. I thought it this way:

we will create a new array

we will run loop and add the elements of our initial array here

but we will add until the last index, that's it

So I began with the following code:

function removeElementFromArray(arrayName){
  let postArray = [];

  for (let i = 0; i < array.length - 1; i++){
  let iniArrayElement = array[i];
  postArray.push(iniArrayElement);
  }
  arrayName = postArray ; 
}

This code was working as expected. It declares an empty array (local scope) inside our function, reads all the elements of our arrayName and adds element one-by-one until the last index. Then it simply assigns the new completed array to our main array, right? No, it doesn't. I was confused cause when i tried console.log(arrayName) after the line arrayName = postArray ;, it was working. But when i tried console.log(array)[array = [1,2,3,4,5]], it gives 1,2,3,4,5 not 1,2,3,4!!

I was really frustrated because I was telling JavaScript to copy all the elements of postArray and assign it to arrayName which refers our main array but JavaScript was kinda betraying me. It was changing the value inside the function but not in the global array. JavaScript wasn't wrong at all! It was I who misinterpreted concepts.

Then I did some research and realized my mistake. JavaScript values are generally grouped into Primitive and Object. When we use = or assignment operator in a variable:

If it is Primitive data-type, then JavaScript simply copies the content of the right side variable/content and stores those data in a memory block and assigns the memory address to the variable. So when we write let num = 2;, javaScript does:

So even if we do:

let x = 5;
let y = x;

y = 10;

console.log(x); // 5
console.log(y); // 10

only y changes, because '=' in primitive copies the whole content and assigns it to a new memory block and gives the memory address to the variable.

If it is an Object-type, then JavaScript doesn't copy the object itself. Instead, it copies the reference to that object. For example:

let arr1 = [5,6,7];
let arr2 = arr1;

Looks like:

So if we do:

arr2.push(8);
console.log(arr1) // [5,6,7,8]
console.log(arr2) // [5,6,7,8]

So push() is actually changing the memory block content which arr2 is pointing at, but arr1 is also pointing at the same address. So as both 'share' the same memory block content, the changes apply to both. But if we do arr2 = [1,2,3] then the engine will actually create a new memory block and assigns its address to arr2 and the changes will be only applicable to arr2.

That is why when i tried arrayName = postArray, I was actually telling JavaScript:

Hey, please change the arrayName reference so it points to postArray address. And the fun fact is that when we sayremoveElementFromArray(array) then JavaScript just tells the engine to make the local variable arrayName point to the same address where the data of global variable array points. We can see this in action:

function test(arrayname){
  arrayname.push('hah');
  console.log(arrayname);
}

test(array); // [ 1, 2, 3, 4, 5, 'hah' ]
console.log(array); // [ 1, 2, 3, 4, 5, 'hah' ]

So the changes applies to both cause both is pointing at the same memory address reference. So what was wrong with our function removeElementFromArray? Because I was telling JavaScript to change the memory address of arrayName to the address which refers to postArray. So I was not updating my array at all. That is why the changes was visible inside the function as I was doing console.log(arrayName) but was not visible as I was doing console.log(array). Built-in methods like push() actually modifies the content, but = actually changes what the variable is referring.

Lesson: I have to make sure I keep the concent of reference in mind while working with data.
The biggest realization:

= NEVER modifies an object.

= NEVER modifies a primitive.

= NEVER modifies ANY value.

It ONLY changes what the variable on the LEFT refers to.

How I then approaches the problem?
A function cannot change which object the caller's variable refers to, but it can mutate the object that both the caller and the parameter currently reference.
I understood that I can't reliably change the global array permanently, rather I can return the changed array and do the rest of the operations with this. But I went deeper and learned about objects also. And then I realized 'every list is essentially an object which has a built-in property called length'.

Array

0 : 10
1 : 20
2 : 30
3 : 40
length : 4

Important:

length is just another property of the array.

So I thought of why not access the property length and change it to currentLength - 1? And I did it.

function removeElementFromArray(arrayName){
  arrayName.length = arrayName.length - 1
  return arrayName; // returning Just for testing
}

In conclusion, JavaScript isn't strange. I was the one who didn't understand how it works. I love solving this types of problems. Facing such problems always makes me learn something new or understand the system better. And I love these sufferings 🙃.

Thanks for taking the time to read this. I really appreciate you cause as a learner, I need people to help me go in the right direction and learn properly. My assumptions might be wrong, or maybe I have explained something in a wrong way or used wrong words. Hoping that you will provide some helpful feedback. And please let me know what mistakes I am still doing.

I thought I understood JavaScript scopes... until this happened ( Learning journal #1-Variables and Data Types)

Mahin Ahmed — Sat, 27 Jun 2026 09:14:37 +0000

Actually, I was learning the fundamentals of programming in JavaScript. I was studying Variables and Data Types where i learnt about scopes.

I understood global and block scope variables. We usually declare a block scope variable with {...} and the variable is only accessible from inside the brackets. If we try working with it outside the brackets then it will throw some errors.

I was thinking okey thats good cause it seems simple right? Until I stumbled upon an interesting problem.

const serviceName = "Auth_Service";
let totalRequests = 100;

{
    let totalRequests = 5;
    const localTimeout = 3000;

    totalRequests = totalRequests + 1;
    // [Checkpoint A] What are the values of serviceName and totalRequests here?
}

// [Checkpoint B] What happens if we try to console.log(localTimeout) here?
// [Checkpoint C] What is the value of totalRequests here?

I was confused cause we declared the same variable totalRequests twice. Once in the global scope and once in the block scope. Shouldn't it throw an error of variable double-declaration?

Then I thougt okey if it doesn't throw an error then it might work, but how? I know we can still access the global variable inside block scope variable. So it might just rewrite the totalRequests value from 100 to 5, then we are adding 1 with it, so it should be 6. And it did.

Output:

// Checkpoint A
serviceName = "Auth_Service"
totalRequests = 6

// Checkpoint B
ReferenceError: localTimeout is not defined

// Checkpoint C
totalRequests = 100

But after trying to reason through it myself, I searched for an explanation and found this:

because your second let totalRequests = 5; was inside a { ... } block, the engine treats that block as a completely isolated room (a new Lexical Environment).

When the engine is inside that block and looks for totalRequests, it checks its immediate room first. It finds the local one, uses it, and ignores the outer one. This is a real engineering concept called Variable Shadowing—the inner variable literally casts a shadow over the outer one, hiding it from view. Once the block ends and the room is destroyed, the shadow lifts, and the global totalRequests (which was never touched or modified) is visible again.

So I interpreted the explaination as ,"Block scope prioritizes its own local variable first, so even if there is one already declared globally, it will not count it."

I am a beginner who is learning JavaScript for the first time and I am currently focusing on strengthening my fundamentals rather than blindly choosing a trending framework. So it was a great funny challenge for me to solve. Though i successfully solved it but my assumptions were incorrect. Maybe I still haven't fully grasped the exact reason yet, if someone is kind enough to help this nerd, I would be too happy to learn it better.

Thanks for reading this. If I've misunderstood something, I'd genuinely appreciate corrections. I'm documenting my learning journey, and I'd love to improve my understanding. I heard dev community is helpful and generous, I hope someone would help me clear out the confusion I have 😊.

DEV Community: Mahin Ahmed

I Tried to Rebuild Array.pop()... Then JavaScript Humbled Me( Learning journal #2-Reference)

Array

I thought I understood JavaScript scopes... until this happened ( Learning journal #1-Variables and Data Types)