definition
A lazy loading function means that the branch executed by the function will only occur once. There are two ways to implement lazy loading functions. The first is to process it when the function is called. In the first call, the function will overwrite another function executed in the appropriate way, so that any call to the function will no longer have to pass through the executed branch. The second way to implement lazy loading is to formulate appropriate functions when declaring functions, so that the function will not lose performance when it is called the first time, and a little performance will be lost when the code is loaded for the first time.
Function
Due to the differences between browsers now, in order to achieve cross-browser work, many functions need to write a large number of if statements or try...catch... statements. When each function is called, each if branch or try statement must be checked, which will slow down the browser's response. In fact, when we open a web page with a certain browser, we decide that a certain if branch or try statement is available, and there is no need to check it every time we call it. To solve the above problems, a technique called lazy loading appears in JavaScript.
Example
Loading method one
var flag = 1;
function test1() {
if(typeof flag === 'undefined') {
test1 = function() {
return 0;
}
} else if(flag === 1) {
test1 = function() {
return 1;
}
} else {
test1 = function () {
return -1;
}
}
return test1();
}
Here, each branch of the if statement will assign a value to the test1 variable, effectively overwriting the original function. The last step is to call the newly assigned function. The next time you call test1(), you will directly call the assigned function, and you will not go through the if statement, which can improve performance.
Loading method two
var flag = 1;
var test2 = (function() {
if(typeof flag === 'undefined') {
return function() {
return 0;
}
} else if(flag === 1) {
return function () {
return 1;
}
} else {
return function () {
return -1;
}
}
})();
The difference is that the function is executed immediately, the function is defined through var, and a function is returned in each if branch.
Advantages
Lazy loading functions have two main advantages. The first is the obvious efficiency problem. Although the function will mean the assignment will be slower when executed for the first time, subsequent calls will be faster because of avoiding repeated detection; the second is that the appropriate code to be executed will be executed only when the actual call function is called. Many JavaScript libraries execute many branches according to the browser when loading, setting up everything implementation, and the lazy loading function will calculate the delay and will not affect the execution time of the initial script.
Summarize
The above is the lazy loading function and advantages in JavaScript introduced to you by the editor. I hope it will be helpful to you, and I am very grateful for your support for my website!