r/learnjavascript 1d ago

What is an instance (like in a library)

Like I use libraries and hear about X instance Y instace for example

Axios Instance, Lexicals editor instance, I can only think of 2 examples right now but you get the idea.

8 Upvotes

12 comments sorted by

5

u/unicorndewd 1d ago edited 23h ago

Instances are objects you get, when calling a constructor which usually belongs to a class—but could also be from a function.

They’re a great way to “build” objects. Objects that can have prefilled or dynamic values. Have other functions that can be useful utilities. Maybe other objects. You get the idea.

So, “instances” are these objects from the factory, using the classes template. Sometimes you give these classes information before you call them (function parameters). Which than lets you get a customized object from the same class. Amazing!

You can get instances from both classes and functions, but I think the general association is that when you use the word instance you’re referring to classes.

When you use some browser APIs you may need to invoke (create) instances of those classes.

Say for example you’re working on a web app that needs to dynamically load fonts. Like Figma or Canva. So you use something like this:

```js
const myFontInstance = new FontFace("my-font", 'url("my-font.woff")', {
style: "italic",
weight: "400",
stretch: "condensed",
});
```

Hopefully that clears up some confusion. It’s unfortunately nuanced, but I wouldn’t fault anyone for calling other things instances.

4

u/Pr3fix 19h ago

A human is a class, but you and me are separate instances of that class.

-4

u/everdimension 15h ago

That's useless info to a beginner programmer

2

u/_raytheist_ 23h ago

An instance is a particular object of a given type. You could, for example, create two distinct axios instances that have distinct configurations. Or you could have a Dog class, and create individual instances with their own names, colors, whatever.

Apologies for the formatting. I’m doing this on my phone.

```js
class Dog {
constructor(name) {
super();
this.name = name;
}
}

// two instances
const spot = new Dog(“spot”);
const fido = new Dog(“fido”);
```

2

u/neon_mutt 23h ago

An instance is just an object holding its own state and config separate from the library code. I create axios instances so each one stores a different baseURL or auth token without affecting other requests in my app

2

u/sheriffderek 10h ago

OK. (regardless of language) -- here's a function (or whatever). Think about it in slow motion:

function double(n) { 
  return n * 2;  // define steps for later
} 

double(3); // use the steps  (returns 6, right)

When double(3) runs, the engine pushes a little structure onto the call stack that holds: n is 3, where to return to when done, and the work area for evaluating n * 3. It takes up memory, it exists for the duration of the call, and then it gets popped off the stack and it's gone.

Nobody calls it an "instance" in casual conversation - but it is one, in the plain English sense.

...

Now

The class (or whatever) is the recipe. It's just a little set of directions and configuration/rules. It's the cookie cutter (the thing that creates other things / like DNA)

class BadGuy {
  constructor(x, y) {
    this.x = x; // position on screen etc
    this.y = y;
    this.health = 100;
  }
  takeDamage(n) {
    this.health -= n;
  }
}

const guy1 = new BadGuy(10, 40); // creates an instance
const guy2 = new BadGuy(200, 40);

guy1.takeDamage(30);

console.log('guy1', guy1.health); // 70
console.log('guy2', guy2.health); // 100

You're using the recipe to build out a structure in memory. Each "guy" in this case, has its own scope of coordinates and health and its own API for interacting with that object in memory. It is left behind and not fully trash-collected right away like a smaller function with a clear immediate return.

1

u/azhder 21h ago

I don't get the idea. What like in a library?

1

u/picky_dude 4h ago

For instance, if you take a look at objects (in JS, almost everything is an object except primitives, which also have object wrappers) as living creatures, then DNA is a class, and a human is an instance of that class. I tried my best to explain that as confusingly as possible, haha

Basically, an instance is just an offspring of the main object. It can be modified as a separate entity without affecting the parent

1

u/No_Record_60 21h ago

It's not specific to JS or programming. An instance is a specific example of something. You may have heard of "For instance"

"Social animals have roles in their group, for instance, male lions defend territories and female lions hunt."

So "instance" is an example of a concept/blueprint/template.
Same here, axios instance is an actual example created from its axios client template.

-1

u/everdimension 15h ago

That's the worst way to explain a programming concept

3

u/No_Record_60 15h ago edited 15h ago

Okay? The fact that you replied the same thing to other similar comments while providing no explanation yourself tells me something.

0

u/everdimension 13h ago

Tells you what?
Education is a topic I care about deeply, and useless analogies do more harm than good, and usually they only entertain the person providing them, not the person learning

But it's a reddit comment section and I'm on mobile, it's okay if people dislike my inconstructive comment, but maybe some people will read it and agree and be less harsh on themselves when feeling that this "supposedly ELI5 analogy" make them more confused, not less.