The content of this article is about what is the function of js? The usage of function in js has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

Function and function

Function is a reference type provided by JavaScript, and Function objects are created through the Function type.
In JavaScript, functions also exist in the form of objects, and each function is a Function object.

//字面量方式創(chuàng)建函數(shù)
var?fun?=function?()?{
????console.log(100)
};
//函數(shù)聲明方式創(chuàng)建函數(shù)
function?fn?()?{
????console.log(200)
};
/*?????創(chuàng)建Funtion類(lèi)型的對(duì)象
*???????var?函數(shù)名?=?new?Function('參數(shù)',''函數(shù)體)*/
var?f?=?new?Function('a','console.log(a)');
f(2);//以函數(shù)方式調(diào)用

Function type

Function’s apply() method

Function’s apply() method is used to call a function , and accepts the specified this value and an array as parameters.

//定義函數(shù)
function?fun(value)?{
????console.log(value)
}
/*
函數(shù)的apply()方法——>用于調(diào)用一個(gè)函數(shù)
?????函數(shù)名.apply(thisArg,[argsArray])
???????thisArg——>可選項(xiàng)，函數(shù)運(yùn)行時(shí)使用的this值
???????argsArray——>可選項(xiàng)，一個(gè)數(shù)組或者類(lèi)數(shù)組對(duì)象,其中的元素作為單獨(dú)的參數(shù)傳給Function函數(shù)。*/
fun.apply(null,['100']);

Function’s call() method

Function’s call() method is used to call a function and accepts the specified this value and parameter list.

var?fun??=?function?(value,a,b,)?{
????console.log(value,a,b,)
}
/*
*???call()方法調(diào)用函數(shù)
*???函數(shù)名.call(thisArg,arg1,arg2,…)
*
*???和apply()的區(qū)別在于提供參數(shù)的方式不同
*/
fun.call(null,2,3,4);//2?3?4

Function’s bind method

Function is used to create a new function, called a bound function, and accepts the specified this value as a parameter, and a parameter list

var?fun?=?function?(a,b,c)?{
????console.log(?a,b,c)
}
/*??bind方法->相當(dāng)于復(fù)制一份當(dāng)前函數(shù)
*???函數(shù)名.bind(thisArg，arg1，arg2，...)
*?????thisArg->當(dāng)綁定函數(shù)被調(diào)用時(shí)，該屬性作為原函數(shù)運(yùn)行時(shí)的this指向
*?????arg->參數(shù)。當(dāng)綁定函數(shù)被調(diào)用時(shí)，這些參數(shù)將在實(shí)參之前傳遞給被綁定的方法
*?????*/

var?v?=fun.bind(null,2,3,4);
v();//2?3?4

No overloading

In other development languages, functions have a feature called overloading. That is to define multiple functions with the same name, but each function receives a different number of parameters. The program will determine which function is called based on the number of actual parameters passed during the call.
There is no overlapping of functions in a single JavaScript. If multiple functions with the same name are defined, only the last defined function is valid.

arguments object

Although there is no overloading, JavaScript provides arguments objects that can simulate the phenomenon of function overloading.

/*
*????argumengs對(duì)象
*????*該對(duì)象存儲(chǔ)當(dāng)前函數(shù)中所有的參數(shù)（實(shí)參）->類(lèi)數(shù)組對(duì)象
*????*該對(duì)象一般用于函數(shù)中
*????*作用-用于獲取當(dāng)前函數(shù)的所有參數(shù)
*????*arguments.length->函數(shù)所有參數(shù)（實(shí)參）的個(gè)數(shù)*/
function?fun()?{
????var?num?=?arguments.length;
????switch?(num){
????????case?2://參數(shù)個(gè)數(shù)
????????????return?arguments[0]+arguments[1];
????????break;
????????case?3:
????????????return?arguments[0]+arguments[1]+arguments[2];
????????break;
????}
}
console.log(fun(4,5));//9
console.log(fun(4,5,6));//15

Recursion

A function that calls itself within the function body is called a recursive function. In a sense, recursion is similar to a loop. Both execute the same code repeatedly and both require a termination condition to avoid infinite loops and infinite recursion.
In a function body, if you want to call its own function, there are two ways

• By using its own function name

• Passed Use the callee attribute of the arguments object to implement

/*//無(wú)線遞歸
function?fun()?{
????console.log('23')
????fun()//調(diào)用自身函數(shù)，實(shí)現(xiàn)遞歸
}
fun()*/

function?fn(v)?{
????console.log(v);
????if?(v>=5){
????????return
????}
????/*fn(v+1)*///使用該方法終止遞歸當(dāng)執(zhí)行下列代碼輸出時(shí)，報(bào)錯(cuò)
????arguments.callee(v+1)
}
/*fn(0)*/
var?f?=?fn;
fn=null;
f(0);

Special function

Anonymous function

In JavaScript, when the function When used as data, the name does not need to be set. Two uses of anonymous functions

• You can pass anonymous functions as parameters to other functions.

• You can define an anonymous function to perform certain one-time tasks.

Callback function

When a function is used as a parameter of another function, the function used as the parameter is called a callback function.

//作為另一個(gè)函數(shù)參數(shù)的函數(shù)fun->回調(diào)函數(shù)
var?fun?=?function?()?{
????return?2;
};

function?fn(v)?{
????return?v();
}
/*
var?result=fn(fun);//函數(shù)fun作為函數(shù)fn的實(shí)參
console.log(result);
*/

//以上代碼等同于以下代碼
//以下代碼中作為參數(shù)的函數(shù)->匿名回調(diào)函數(shù)

var?f?=?fn(function(){return?2;});
console.log(f);

Self-tuning function

Self-tuning function is a function that calls itself after defining the function

/*????自調(diào)函數(shù)->定義即調(diào)用的函數(shù)
*??????相當(dāng)于在匿名函數(shù)外加了小括號(hào)
*??????第一對(duì)括號(hào)->定義函數(shù)
*??????第二對(duì)括號(hào)->調(diào)用函數(shù)*/

(function?()?{
????console.log('23')
})()//23->后邊的括號(hào)表示調(diào)用

One function acts as another function The result is returned, and the function returned as the result is called a function as a value

var?one?=?function(){
????return?100;
}
//?作為值的函數(shù)?->?內(nèi)部函數(shù)的一種特殊用法
function?fun(){
????var?v?=?100;
????//?內(nèi)部函數(shù)
????return?function(){
????????return?v;
????};
}

var?result?=?fun();
//?console.log(result);//?one函數(shù)
//?console.log(result());//?100

console.log(fun()());

Closure

Scope chain

Scope chain means that the local scope can access the scope that its parent can access

var?a?=?10;//?全局變量
function?fun(){
????var?b?=?100;//?fun函數(shù)作用域的局部變量
????//?內(nèi)部函數(shù)
????function?fn(){
????????var?c?=?200;//?fn函數(shù)作用域的局部變量
????????//?內(nèi)部函數(shù)
????????function?f(){
????????????var?d?=?300;//?f函數(shù)作用域的布局變量
????????????//?調(diào)用變量
????????????console.log(a);//?10
????????????console.log(b);//?100
????????????console.log(c);//?200
????????????console.log(d);//?300
????????}
????????f();
????????//?調(diào)用變量
????????//?console.log(a);//?10
????????//?console.log(b);//?100
????????//?console.log(c);//?200
????????//?console.log(d);//?d?is?not?defined
????}
????fn();
????//?調(diào)用變量
????//?console.log(a);//?10
????//?console.log(b);//?100
????//?console.log(c);//?c?is?not?defined
????//?console.log(d);//?d?is?not?defined
}
fun();

Closure

When any internal function is passed When a method is accessed from any outer scope, it is a closure.

var?n;//?定義變量，但不初始化值
function?fun(){//?函數(shù)作用域
????var?v?=?100;
????//?進(jìn)行初始化值?->?一個(gè)函數(shù)
????n?=?function(){
????????console.log(v);
????}
????//?n();
}
fun();

n();//?100

The role of closure

• Provide shareable local variables

• Protect shared local variables and provide special reading Write functions of variables

• Avoid global pollution

Related recommendations:

Introduction to JavaScript Function function types

A brief analysis of the understanding of functions in JS

Function type in ECMAScript_javascript skills

The above is the detailed content of What is the function function of js? How to use function in js. For more information, please follow other related articles on the PHP Chinese website!