Function type of JavaScript reference data type: creating functions, function internal properties, function properties and methods, etc.

Function type of JavaScript reference data type

(1) Create function

var add = function(x,y){
    
    
  return x+y;
};
console.log(add(10,10));//20

(2) The js function is not overloaded

function sum(x,y){
    
    
  return x+y+',执行函数1。。。。';
}

function sum(x,y){
    
    
  return x+y+',执行函数2。。。。';
}
console.log(sum(10,10));       //20,执行函数2。。。。

(3) As a function of value

function callSomeFunction(someFunction,someArg){
    
    
  return someFunction(someArg)       //返回一个函数和参数add10(20)
}
function add10(num){
    
    
  return num+10;
}
console.log(callSomeFunction(add10,20));   //函数add10()作为参数传入callSomeFunction()

(4) Function internal attributes: arguments, this, caller

1. Arguments: Save parameters. arguments is an array-like object, and its attribute callee is a pointer pointing to the function that owns this arguments object, that is, f()

function f(num){
    
    
  if(num<=1) return 1;
  else return num*arguments.callee(num-1);  
}
console.log(f(5));//120  

5 f(4)=5 4 f(3)=5 4 3 f(2)=5 4 3 2 f(1)=5 4 3 2 2*1=120

2、this

window.color = 'red'
var obj = {
    
    color:'blue'}
function sayColor(){
    
    
  console.log(this);
}
sayColor();                //this是widow全局对象 
obj.sayColor = sayColor;
obj.sayColor();            //this是对象obj的执行环境对象

3. caller: holds a reference to the function that calls the current function (the function that calls this function)

function outer(){
    
    
  inner();
}
function inner(){
    
    
  console.log(inner.caller);//ƒ outer() {inner();}
  console.log(arguments.callee.caller);//访问相同信息   ƒ outer() {inner();}
}
outer();

(5) Function attributes: length, prototype

1. length: the number of named parameters the function hopes to receive.

console.log(sum.length);

2. Prototype: saves the real location of all instance methods. It is not enumerable in E5, so it cannot be discovered using for-in.

console.log(sum.prototype);

(6) Function methods: apply(), call(), bind()

Set the value of the object in the function body (change the pointer of this inside the function body)

1. apply() passes in parameters: this+parameter array

function callSum1(n1,n2){
    
    
  return sum.apply(this,arguments);
}
function callSum2(n1,n2){
    
    
  return sum.apply(this,[n1,n2]);
}

2. call() passes in parameters: this + multiple parameter values

function callSum3(n1,n2){
    
    
  return sum.call(this,n1,n2)
}
function callSum4(n1,n2){
    
    
  return sum.cal(this,arguments[0],arguments[1])
}
console.log(callSum1(10,20));   
console.log(callSum2(20,20));    
console.log(callSum3(10,40));    
console.log(callSum4(20,40));    

3. bind() incoming parameters: specify the this value of the bound function

window.color = 'red'
var obj = {
    
    color:'blue',name:'HNN'}
function sayColor(){
    
    
  console.log(this.color);
}

var objSayColor = sayColor.bind(obj)   //绑定函数的this值为obj后执行  <==> sayColor.bind(obj)()
objSayColor()              //blue    this=>obj
sayColor()                 //red     this=>window

4. Function: Expand the scope in which the function operates

function People(name,age){
    
    
  this.name = name;
  this.age = age;
  console.log(this);
}
function Student(name,age,grade){
    
    
  People.call(this,name,age)      //this代表Student,使用Student调用People中的方法,将name,age参数传过去
  this.grade = grade;
  console.log(this);
}
var stu = new Student('小明',18,'大三');
console.log(stu.name+","+stu.age+","+stu.grade);//小明,18,大三

Guess you like

Origin blog.csdn.net/m0_47147246/article/details/125731949