Home > Web Front-end > JS Tutorial > body text

Knowledge required for js functions

小云云
Release: 2018-02-28 14:31:13
Original
1073 people have browsed it

You must know that in js, the reference type is a data structure, including 5 reference types, namely Object, data, Array, rePlease enter the code gExp, Function. Today we will talk about the data structure of Function. In js, functions are actually objects, and each function is an instance of the Function type. Like other reference types, they have properties and methods.

1. There are several ways to define functions

  1. Function declaration syntax definition

        function sum(num1,num2){
       return num1+num2;
      }
    Copy after login
  2. Function expression
    Note There is a semicolon after the function expression;

   var sum=function(num1,num2){
      return num1+num2;
}
Copy after login
  1. Use the Function constructor

    使用构造函数可以接收任意数量的参数,但最后一个参数始终被看成是函数体,而前面的参数则枚举出了参数
    Copy after login
var sum=new Function("num1","num2","return num1+num2")
Copy after login

Of course the third option The method is unfriendly and not recommended.

The function name is just a pointer to the function, so the function name is no different from other variables containing object pointers. That is to say, a function may have multiple names.

What is the difference between function declaration and function expression here?
When the parser loads data into the execution environment, it treats function declarations and function expressions differently. The parser first reads the function declaration and makes the function declaration code callable before any code. This is what we usually call function declaration hoisting. Function expressions are different. They must wait until the function parser executes the code block where they are located before they are actually executed. Compare the following two examples

console.log(sum(10,10));

function sum(n1,n2){
   return n1+n2;
}

以上代码会正常执行

再看!

console.log(sum(10,10));

var sum=function(n1,n2){
   return n1+n2;
}

以上执行器就会报错!
Copy after login

2. Functions are not overloaded

If two functions with the same name are declared, the result is that the later function overwrites the previous function.

function sun(a){
  return a+100;
}
function sun(a){
  return a+200;
}

var result=sum(2)//202
Copy after login

3. The internal attributes of the function

  • Including this, arguments

    The details will not be described

4. Function attributes and methods

  • The function has 2 attributes, length and prototype

length indicates that the function hopes to receive named parameters number.

function a(name){
 //todo
}
function b(name,age){
 //todo
}
function c(){
 //todo
}

a.length //1
b.length //2
c.length //0
Copy after login

The prototype attribute is very important for reference types and will be explained specifically, so I won’t go into details here.

  • Each function contains two non-inherited methods apply and call

The purpose of these two methods is to perform specific functions Calling a function in a domain actually sets the value referred to by this in the function body.

first. The apply() method receives two parameters, one is the scope in which the function runs, and the other is the parameter array. The second parameter can be an instance of the array or arguments.

function sum(num1,num2){
   return num1+num2;
}

function test1(a,b){
    return sum.apply(this,arguments);
}

function test2(c,d){
    return sum.apply(this.[c,d]);
}

console.log(test1(1,1)) //2

console.log(test2(1,1)) //2
Copy after login

call method and apply method Not much difference. The difference is that the second parameter of the call method must be listed one by one.

The biggest advantage of using call and apply to expand the scope is that the object is not coupled to any method.

Related recommendations:

Detailed explanation of JS function examples

##js Passing parameters of functions by value

JS function calls and issues related to implicit parameters arguments and this

The above is the detailed content of Knowledge required for js functions. 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