What is a class?

1

what is a class?

Wiki: In object-oriented programming, a class is an extensible program-code-template for creating objects, providing initial values for state (member variables) and implementations of behavior (member functions or methods).

that doesn’t help, that just raises more questions, like what is an program-code-template? whats a member variable? WTF is a member function?
can someone explain what a class is to someone who doesn’t speak the coding language. explain it to me like I’m 5.

2

In object oriented programming, you represent things using objects. An object is a collection of properties and functions (methods). Like a Person might have the properties name andage, and the method postToInternet(url, message).

A class is like a blueprint for an object: it’s a description of what the object contains, and when it’s invoked, creates an instance of that object. So:

var Harry = new Person('Harry', 25)
var Gary = new Person('Gary', 22)
3

thank you, though why not bp or blueprint instead of class?

4

Because the inventor of C++ (back in the 80s) some guy named Bjorn Stroustrup, decided to call it a “class.” The object is declared with the keyword class .

class person
{
  public:
    string name;
    int age;
};
5

As additional information, there’s no difference between an struct and a class in C++ apart from the default accessibility option.

6

The name “class” make sense to me. It has meanings in set theory and biology. It’s just a grouping that shares certain charecteristics. But the metaphor of a blueprint is probably better.

It should be pointed out that JavaScript’s version of “class” and “object oriented programming” is not quite the real deal. It’s like what Chipotle Grill is to Mexican food - it gets some of the flavors but it’s not quite the real deal. But some of the concepts can be useful.

7

Because human language is composed of arbitrary symbols that are determined by historical consensus. You can choose to call them “blueprints”, but then you’ll be inventing your own language.

You’ll find in general that computer science-specific vocabulary has a lot of counter-intuitive wording, because what it describes is also not intuitive.

8

so what is counter-intuitive (another scrabble word) wording of Divs and IDs?

also ksjazzguitar, love the food analogy, I’m leaving the restaurant industry of 8 years for the coding world, so the more the merrier.

9

Ah, wait a minute, you don’t mean class as in OO class here, you mean class as in the HTML attribute class?

class is called that because that’s the right word to use: word comes from biology (a group of related plants or animals) but it’s commonly used outside of biology to refer to a [sub] group of related things.

id is called id because it’s an id, eg an element can have a single identifier/identity.

div, um, I think maybe it came from division or divider, as in you divide the page up. The word doesn’t really mean anything except itself, a div is a div. A div is a generic element, a way to put a group of other elements in a block. The name deliberately doesn’t carry any meaning - anything more specific (like block or container maybe) will have a specific meaning in different contexts.

Note that there is an inline version of div, called span - whereas a div is a block of content, a span is often a way to target some text inside a bigger bit of text - <p>Some text <span>and some text I'd like to do something different with</span></p>. span could be like a “span” of text, but really the word is also meaningless beyond a span is a span.

EDIT for example:

<div class="media-container image-container" id="media-item001">
  <img src="https://path/to/some/img.png" alt="some image" />
</div>

So I have an an image, and to make it easier to style, I’ve wrapped it in a container. Maybe the container can contain various kinds of media - images, videos, text etc. It’s just a generic container I want to add styling to - it’s not a specific kind of thing, so I just use div.

It has a unique identifier (id) of image001 - there are a few reasons I might want this, often to do with selecting/modifying elements using JavaScript. Note that a lot of the time IDs aren’t incredibly useful, only use them if you definitely need to use them.

It has two classes - media-container and image-container. So I could have multiple elements on the page with those classes. That means I can style all the media-containers and all the image-containers at once using CSS, like

.media-container {
  padding: 1rem;
  border: 2px solid grey;
}

.image-container {
  background-color: blue; 
}

.video-container {
  background-color: red;
}

/* ...and so on */

IDs are unique, classes are non-unique. You can use the same class name on any number of different elements, you can only use the ID once on a single element.

10

if you want to know about classes in ES6 use this link it would be helpful in react if you learn ES6. if you wanted to learn javaScript ES6 syntax take this course

11

It sounds like OP is asking about classes in terms of HTML/CSS. Sounds like they were trying to look that up and mistakenly looked up the word class in a C++ sense.

Member variables/functions applies to C++ and Object Oriented Programming, not to HTML/CSS classes.