Struggling to locate __proto__ of the global object known as "window."

Currently I am using Google Chrome browser.

console.log(window.__proto__.__proto__.__proto__);

console.log(window.__proto__.__proto__.__proto__ === EventTarget.prototype);

The first code mentioned above returns EventTarget.prototype for me.

This can be confirmed with the second code, which returns "true."

Furthermore, the following code also evaluates to true:

console.log(EventTarget.prototype.__proto__ === Object.prototype);

However, issues arise when attempting to identify the child of EventTarget.prototype.

console.log(window.__proto__.__proto__);

The code above results in:

WindowProperties {Symbol(Symbol.toStringTag) : "WindowProperties" .....}

When trying to locate the constructor "WindowProperties()" or the object "WindowProperties.prototype",

the console outputs

Uncaught ReferenceError: WindowProperties is not defined at :1:13

Why does this error occur?

Answer №1

There is no access to a global called WindowsProperties from your code, even if it exists with a specific name. This situation can be seen in the following example:

const example = (() => {
    return new class Something { };
})();
console.log(example.__proto__.constructor.name); // Something
console.log(Something); // ReferenceError: Something is not defined

It is worth noting that the usage of __proto__ in the code above is for demonstration purposes only. It is recommended to use Object.getPrototypeOf (and, if necessary, Object.setPrototypeOf) instead of __proto__, as it is a deprecated feature present in browsers and not universally supported by all objects.


Intrigued by your code, I explored the lineage of window in Chrome and came up with the following snippet:

const seenBefore = new Set();
let indent = "";
let obj = window;
while (obj) {
    const proto = Object.getPrototypeOf(obj);
    if (seenBefore.has(proto)) { 
        console.log("Encountered a previously seen object; exiting loop");
        break;
    }
    seenBefore.add(proto);
    console.log(`${indent}${proto?.constructor?.name}`);
    indent += "  ";
    obj = proto;
}

Output on Chrome:

Window
  WindowProperties
    EventTarget
      Object
        undefined

Output on Firefox differs slightly:

Window
  EventTarget
    EventTarget
      Object
        undefined

Answer №2

When typing window._ proto _ @ console, the result is displayed on the screen.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

VueJS does not update values instantly as they change

I have implemented a JS class with the following code: class Field { public Value = null; public Items = []; public UniqueKey = null; public getItems() { let items = [...this.Items]; items = items.filter((item) => { ...

AlphaVantage Platform: Element not found

As someone new to API services, I'm currently working on constructing a dashboard that pulls data from the Alphavantage API. My goal is to retrieve data for 3 symbols simultaneously by creating a list and passing the index to my API call. Each symbol ...

Notes on using touch devices with Angular

My goal is to make my Angular application capable of displaying a footnote on mobile devices when text injected with nativeElement.innerHTML is clicked. I attempted to explain this before but feel that I didn't do it justice, so here's another sh ...

Having trouble with Angular + Rails combination: Angular can't seem to locate the controller

Issue: I am encountering an error in my Angular / Rails app. When trying to access a Rails controller function from the Angular controller, I receive the following error: Uncaught TypeError: tasks.moveOrder is not a function. Strangely, all other functions ...

Mastering React hooks: A guide to effectively updating and rendering elements

Each time I click the delete button, it seems to only remove the last element instead of the specific one based on index. Is there a better way to achieve this without changing from <input defaultValue={name} /> to <input value={name} /> in t ...

Tips on serializing two arrays into JSON format and incorporating them in an AJAX request

I have a task where I need to retrieve all the names and details associated with a specific reference number. To accomplish this, I am using a while loop. However, I am unsure of how to encode these values in JSON format so that I can use them in AJAX for ...

Is this included in the total number of reads?

Following my query with CollectionsGroup, I attempted to retrieve the information of the parent's parent like this: db.collectionGroup('teams').where('players', 'array-contains', currentUser.uid).get().then(function(snaps ...

JavaScript issue causing input fields to malfunction and clear text boxes

I apologize for the simplicity of this question, but I am struggling with an issue and seeking help. Here's the problem: my calculate() method is not clearing text input as expected when testing my page. Below is the HTML markup and script: <!DOC ...

Measuring Time Passed with JavaScript

I've been working on a small piece of code that needs to achieve three tasks: User should input their birthday User must be able to view the current date When the user clicks a button, they should see the time elapsed between their birthday and the ...

Sorting customization within a complex nested array structure

Sorting a nested array can sometimes be tricky. Consider a JSON structure like the one shown below: var orders = [{ 'orderId': 1, 'sales': [{ 'salesNumbers': 3 }] }, { 'orderId': 2, ...

Discovering elements with Selenium

While using selenium, I stumbled upon this web element: <td style="padding-right: 10px; " **onclick="javascript:show_me('CarDetails.php?CarID=2358912&SubCatID=1**', '2358912', 560, 'ActiveLinkVisited');stat( '../& ...

Just starting out with json/ajax and I received an error in the Console that says: Uncaught TypeError: Cannot read property 'length' of undefined

I’m encountering an issue with my code. I must emphasize that I’m brand new to this, so please bear with me if the solution is simple. I did attempt to solve it myself before reaching out for help and searched through various posts with similar errors, ...

The Ajax function is not defined and results in a runtime error being thrown

customAjax.postJson( "/foo/GetFoo", { fooName: fooName }, function (data) { }, function (error) { }); }; My Rest api call is GetAsync() It throws customAjax is unde ...

What methods can I use to ensure the headline remains fixed like the table headers?

I am currently working on creating sticky table headers. Below is an example showcasing my progress and what I am aiming to accomplish. Below is the script I discovered from another source. function makeTableHeadersSticky(tableId) { var thArr = $(tableId ...

What is the best way to filter an array based on the property of its inner array?

I am grappling with the following array of objects: let a = [ { b: [1, 11, 12], c: "a1" }, { b: [2, 56, 1], c: "a2" }, { b: [1, 2, 3], c: "a3" } ] In search of an operation that is b ...

Can you explain the distinction between employing express.urlencoded() with extended set to true as opposed to setting it to false along with performing manual JSON stringify/parse calls?

Within my NodeJS/Express server, I am faced with the decision of setting extended to either true or false for the urlencoded middleware: app.use(express.urlencoded({ extended: true/false })); I have come to understand that when set to false, it signifies ...

Ways to change the color of a button when it is clicked?

I am attempting to change the color of a button on another button click, but it doesn't seem to be working. function show_col(){ console.log("hello"); var path=localStorage.getItem(".physics_section #color1 button"); $(''+ ...

Using Three.js to Manipulate Objects through Their Names

Is there a way to access multiple meshes with the same name? var mesh1 = new THREE.Mesh( geometry, new THREE.MeshBasicMaterial( { color: 0xffffff })); mesh1.name = "meshes"; scene.add( mesh1); var mesh2 = new THREE.Mesh( geometry, new THREE.MeshBasicMate ...

Importing an array of Vue components to be exported and utilized in the app.js file

I'm currently working on a Laravel 8 project with vue.js v2.6 and I want to clean up my app.js file by moving all of my Vue.component() declarations to a separate file. To achieve this, I created js/vueComponents.js where I placed all the vue componen ...

Encountering a "DOM Exception 11: InvalidStateError" when attempting to use websocket.send

I encountered the following error message: DOM Invalidate exception 11 This error is coming from the code snippet below, but I'm having trouble identifying the root cause. /*The coding style may appear pseudo-stylish with potential syntax errors*/ ...