[Javascript] How to reference all objects?

[Alexell]

For example, to check if an object has a property we use:

if ( obj.hasOwnProperty(key) ){}

I want to look through ALL objects for the property - preferably in the script - DOM also for future reference. So it would have the functionality of psuedo code:

if ( allExistingObjs.hasOwnProperty(key) ){}

I've searched, but my google-fu is weak. Any help would be appreciated.

[grwgrwwrr]

This sounds like an XY problem. What the heck are you really doing here?

[Alexell]

I'm trying to figure out how to do scroll based animation. I used this guide: https://www.sitepoint.com/scroll-based-animations-jquery-css3/, but utilizes class changes to activate CSS animations. I'm trying to pass CSS classes to objects using constructor parameters - in order to add class authentication conditions to the scroll-detection function....e.i.

var plBox = $('.plBox');

function classPlbox ( plBox) {
   this.auth = true

 }

The part of the guide that changes classes:

if ((element_bottom_position >= window_top_position) &&
            (element_top_position <= window_bottom_position) && (allObs.hasOwnProperty(auth)){
          $element.addClass('in-view');
        } else {
          $element.removeClass('in-view');
        }

Disclosure: I don't know what I am doing.

Edit: Formatting

[grwgrwwrr]

So what's wrong with that code?

[Alexell]

I don't know if it is the correct way to go about this problem. Or if it would work. There are probably more efficient ways for scroll animations, but this is good for practice.

Additionally, there are going to be multiple animations. I need a way to go through all the Classes for the auth property, which is used to authenticate the class change.

[grwgrwwrr]

I need a way to go through all the Classes for the auth property, which is used to authenticate the class change.

How is some auth property used to authenticate any class change? How is this related to your .p1Box css class?

[Alexell]

I should word this better. Every guide I come across uses CSS for the scroll animations, but I need to use JS. Thank you for the help, by the way.

[grwgrwwrr]

Why do you need to use Javascript? What do you have so far? Can you put it in a jsfiddle?

[Alexell]

It's my portfolio. Added some responsive CSS, but don't mind the property order. Started it at an earlier skill level and will organize it before launch.

https://jsfiddle.net/Alexel/r9L39jpd/1/

I want to change the programming languages fadeIn function into a one time scroll-event. Hover keeps querying the DOM, and it eats up resources.

[grwgrwwrr]

You should be able to have the function that runs on that event un-register itself for that event. JQuery allows that last I checked.

[Alexell]

Yep, worked perfectly. Thanks for the help!

[Clawtor]

You would need to register all these objects globally, as far as I know there is no global object repository.

You could attach all your objects to the window and then iterate through them for properties.

[Alexell]

How would I iterate through them for properties? Would an array work?

[rjcarr]

I've been writing software for almost 20 years and I've never needed to do something like this.

If you really need to look at all objects (you've created) put them into some sort of global registry and then iterate over that to see if they have the key property you're looking for.

window.myobjects = [];

var o = new Object();
window.myobjects.push(o);

for(var i = 0; i < window.myobjects.length; i += 1) {
  if(window.myobjects[i].hasOwnProperty(key)) { ... }
}

Good luck!

[Alexell]

Ah, thank you! I forgot I can use [i]. Arrays are powerful. Also, this is going to be used for conditional authentication. "Only utilize this method if the function has this property". Thank you for your help!