前端那些事系列之基础篇函数（六）

定义

函数是一个被定义一次，但可能被执行或调用多次的可执行代码。由函数名称标识符和一对圆括号、一对花括号组成。

function test(){
}

函数调用

1）函数调用

对于普通函数的调用，函数的返回值成为调用表达式的值。

function test(){
	console.log("aaa")
};
test();

2) 方法调用

一个方法也就是保存在对象中属性的javascript函数。和函数调用有区别的部分是调用上下文。该对象为调用上下文，函数体可以使用关键字this引用该对象。任何函数只要作为方法调用实际上都会传入一个隐式的实参——当前对象，方法调用的母体就是这个对象。

const bar = {
    foo() {
        console.log(`this is foo method of ${this.name}`)
    },

    name: "BAZ"
};
global.name = "GLOBAL";
const foo = bar.foo;
foo(); // this is foo method of GLOBAL
bar.foo(); // this is foo method of BAZ

3）构造函数调用

如果函数或方法调用之前带有关键字new，它就构成构造函数调用。

const Bar = function(name, fn) {
    this.name = name;
    this.handler = fn;
};

const bar = new Bar('bar', function() {
    console.log(this.name);
});

console.log(bar);

bar.handler();

4）call、apply调用

const bar = {
    // bar 这个对象，有个函数，叫做foo，可以打印对象调用者的名字和参数。
    foo(param) {
        console.log(`this is foo method of ${this.name}，the param is ${param}`)
    },
    name: "BAR",
};

// 假如，我现在，有一个对象，叫做 obj, 这个 obj 想要使用这个 bar 的 foo 方法
// 但是我没有，我就只有“借用”。
const obj = { name: 'simple object' };

bar.foo.apply(obj, ['objParam'])

• apply、call、bind区别

都是调用一个给定this作用域的函数，区别是apply传入的是数组或者类数组对象，call传入的是一个或多个参数，bind不同，返回的是一个新函数。
apply:调用一个具有给定this值的函数，以及以一个数组（或类数组对象）的形式提供的参数
call: 使用一个指定的 this 值和单独给出的一个或多个参数来调用一个函数
bind: 创建一个新的函数，在 bind() 被调用时，这个新函数的 this 被指定为 bind() 的第一个参数，而其余参数将作为新函数的参数，供调用时使用。

实参和形参

• 形参

function test(param) {
    console.log(param);
}

• JavaScript 语言本身，既没有给形参限制类型，也没有给形参做类型检查。
  • JS 是没有重载的。
  • 指一个类中可以有多个相同名称的方法，但是这些方法的参数不同
    形参可选，可多可少。
    当形参多余实参，多出的是undefined；
    当形参少于实参， arguments或…rest

高阶函数

• 作为值

// 函数可以作为值
function square(x) { return x * x };

const a = square;

console.log(square(2));
console.log(a(2));

• 作为参数

function calculate(param, cb) {
    setTimeout(() => {
        const res = param * param - param;
        cb(res);
    }, 500);
};

calculate(234, (res) => {
    console.log(`after 500ms, the result is ${res}`);
});

• 作为返回值

function discount(ratio) {

    let _ratio = ratio;
    
    return function(price) {
        console.log(_ratio * price);
    };
};

const discount75 = discount(0.75);