Home > Web Front-end > Front-end Q&A > Why JavaScript needs to be encapsulated

Why JavaScript needs to be encapsulated

WBOY
Release: 2022-04-13 19:15:28
Original
2918 people have browsed it

Reasons for encapsulation: 1. Encapsulation can reduce code redundancy, make the code look uncomplicated, and reduce unnecessary code; 2. Objects only provide the necessary interfaces for interacting with other objects. Different levels of protection can be provided for internal data to prevent unrelated parts of the program from accidentally changing or incorrectly using the private parts of the object, which can improve security.

Why JavaScript needs to be encapsulated

The operating environment of this tutorial: Windows 10 system, JavaScript version 1.8.5, Dell G3 computer.

Why does JavaScript need to be encapsulated?

Encapsulation is one of the three basic characteristics of object-oriented. It abstracts things in the real world into objects in the computer field. The objects have both properties and behaviors (methods). , this abstraction is encapsulation.

In our daily development process, codes with the same processing logic usually encapsulate functions to reduce code redundancy and make the code look more elegant and beautiful, then

When multiple entity objects have the same attributes and behaviors (methods), it is natural to abstract these same attributes and behaviors to reduce unnecessary code.

Important features of encapsulation: data hiding.

The object only provides the necessary interfaces for interacting with other objects, while hiding some of its own attributes and implementation details from the outside. In this way, the object provides different levels of protection for internal data to prevent programs from Unexpected changes to unrelated parts of the object or incorrect use of private parts of the object. This ensures security while ensuring normal interaction, and you can use this object without caring about the methods implemented by the object.

Function (function)-the simplest encapsulation

Function is a core concept for any language. Any number of statements can be encapsulated through functions, and they can be called and executed anywhere and at any time.

How to encapsulate: Write scattered statements into the curly braces of the function to become the function body, and then you can call it.

Unencapsulated code:

var body = document.getElementsByTagName("body")[0];
        var h1 = document.createElement("h1");
        body.style.backgroundColor = "green";
        h1.innerText = "绿了";
        body.appendChild(h1);
Copy after login

Disadvantages:

  • is easily overwritten by variables with the same name - because it is in the global scope Declared variables are easily overwritten by variables with the same name

  • Execute immediately--The parser reads here and executes immediately

Encapsulation Code:

function makeGreen() {
            var body = document.getElementsByTagName("body")[0];
            var h1 = document.createElement("h1");
            body.style.backgroundColor = "green";
            h1.innerText = "绿了";
            body.appendChild(h1);
        }
Copy after login

Advantages:

  • Avoid global variables--because of the existence of function scope (the emphasis is on function scope, which will be tested later)

  • Execute on demand--the parser reads here and the function is not executed. Only call this function when you need it

  • Improve code reusability

[Related recommendations: javascript video tutorial, web front-end

The above is the detailed content of Why JavaScript needs to be encapsulated. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template