javascript-面向对象-Function类型

sugarmo 发布于2019-08-26 12:13 / 1825人阅读

摘要：在中，函数也是以对象的形式存在的，每个函数都是一个对象。可以定一某个匿名函数执行某些一次性任务。定义变量，但不初始化值函数作用域进行初始化值一个函数闭包的作用提供可享的局部变量保护共享的局部变量，提专门读写变量的函数避免全局污染

Function与函数

Function是JavaScript提供的一种引用类型，通过Function类型创建Function对象。
在JavaScript中，函数也是以对象的形式存在的，每个函数都是一个Function对象。

//字面量方式创建函数
var fun =function () {
    console.log(100)
};

//函数声明方式创建函数
function fn () {
    console.log(200)
};

/*     创建Funtion类型的对象
*       var 函数名 = new Function("参数",""函数体)*/
var f = new Function("a","console.log(a)");
f(2);//以函数方式调用

Function类型 Function的apply()方法

Function的apply()方法用于调用一个函数，并且接受指定的this值，以及一个数组作为参数。

//定义函数
function fun(value) {
    console.log(value)
}
/*
函数的apply()方法——>用于调用一个函数
     函数名.apply(thisArg,[argsArray])
       thisArg——>可选项，函数运行时使用的this值
       argsArray——>可选项，一个数组或者类数组对象,其中的元素作为多带带的参数传给Function函数。*/
fun.apply(null,["100"]);

Function的call()方法

Function的call()方法用于调用一个函数，并且接受指定的this值，以及参数列表。

var fun  = function (value,a,b,) {
    console.log(value,a,b,)
}
/*
*   call()方法调用函数
*   函数名.call(thisArg,arg1,arg2,…)
*
*   和apply()的区别在于提供参数的方式不同
*/
fun.call(null,2,3,4);//2 3 4

Function的bind方法

Function用于创造一个新的函数，称为绑定函数，并且接受指定的this值作为参数，以及参数列表

var fun = function (a,b,c) {
    console.log( a,b,c)
}
/*  bind方法->相当于复制一份当前函数
*   函数名.bind(thisArg，arg1，arg2，...)
*     thisArg->当绑定函数被调用时，该属性作为原函数运行时的this指向
*     arg->参数。当绑定函数被调用时，这些参数将在实参之前传递给被绑定的方法
*     */

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

没有重载

在其他开发语言中，函数有一种特性叫做重载。就是定义多个同名的函数，但没一个函数接收的参数个数不同，程序会根据调用时传递的实参个数进行判断，具体调用的是哪个函数。
单JavaScript中函数是没有重叠现象的，如果定义多个同名的函数，只有最后一个定义的函数是有效的。

arguments对象

虽然没有重载，但是JavaScript提供了argumengs对象可以模拟函数重载的现象。

/*
*    argumengs对象
*    *该对象存储当前函数中所有的参数（实参）->类数组对象
*    *该对象一般用于函数中
*    *作用-用于获取当前函数的所有参数
*    *arguments.length->函数所有参数（实参）的个数*/
function fun() {
    var num = arguments.length;
    switch (num){
        case 2://参数个数
            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

递归

在函数体内调用自身的函数被称之为递归函数。在某种意义上来说，递归近似于循环。两者都重复执行相同的代码，都需要一个终止条件来避免无限循环和无限递归。
在一个函数体内，想要调用自身函数，有一下两种方式

通过使用自身函数名实现

通过使用arguments对象的callee属性来实现

/*//无线递归
function fun() {
    console.log("23")
    fun()//调用自身函数，实现递归
}
fun()*/

function fn(v) {
    console.log(v);
    if (v>=5){
        return
    }
    /*fn(v+1)*///使用该方法终止递归当执行下列代码输出时，报错
    arguments.callee(v+1)
}
/*fn(0)*/
var f = fn;
fn=null;
f(0);

特殊函数 匿名函数

在JavaScript中，当把函数当做数据使用时，可以不设置名字。匿名函数的两种用法

可以将匿名函数作为参数传给其他函数。

可以定一某个匿名函数执行某些一次性任务。

回调函数

当一个函数作为另一个函数的参数时，作为参数的函数被称之为回调函数。

//作为另一个函数参数的函数fun->回调函数
var fun = function () {
    return 2;
};

function fn(v) {
    return v();
}
/*
var result=fn(fun);//函数fun作为函数fn的实参
console.log(result);
*/

//以上代码等同于以下代码
//以下代码中作为参数的函数->匿名回调函数

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

自调函数

自调函数就是在定义函数后自行调用

/*    自调函数->定义即调用的函数
*      相当于在匿名函数外加了小括号
*      第一对括号->定义函数
*      第二对括号->调用函数*/

(function () {
    console.log("23")
})()//23->后边的括号表示调用

作为值的函数

一个函数作为另一个函数的结果进行返回，作为结果返回的函数称之为作为值的函数

var one = function(){
    return 100;
}
// 作为值的函数 -> 内部函数的一种特殊用法
function fun(){
    var v = 100;
    // 内部函数
    return function(){
        return v;
    };
}

var result = fun();
// console.log(result);// one函数
// console.log(result());// 100

console.log(fun()());

闭包 作用域链

作用域链就是指局部作用域可以访问它的父级所能访问的作用域

var a = 10;// 全局变量
function fun(){
    var b = 100;// fun函数作用域的局部变量
    // 内部函数
    function fn(){
        var c = 200;// fn函数作用域的局部变量
        // 内部函数
        function f(){
            var d = 300;// f函数作用域的布局变量
            // 调用变量
            console.log(a);// 10
            console.log(b);// 100
            console.log(c);// 200
            console.log(d);// 300
        }
        f();
        // 调用变量
        // console.log(a);// 10
        // console.log(b);// 100
        // console.log(c);// 200
        // console.log(d);// d is not defined
    }
    fn();
    // 调用变量
    // console.log(a);// 10
    // console.log(b);// 100
    // console.log(c);// c is not defined
    // console.log(d);// d is not defined
}
fun();

闭包

当内部任何一个函数被通过一种方式被任何一个外部作用域访问时，就是一个闭包。

var n;// 定义变量，但不初始化值
function fun(){// 函数作用域
    var v = 100;
    // 进行初始化值 -> 一个函数
    n = function(){
        console.log(v);
    }
    // n();
}
fun();

n();// 100

闭包的作用

提供可享的局部变量

保护共享的局部变量，提专门读写变量的函数

避免全局污染

混合云云服务器 javascript 面向对象 javascript面向对象 javascript面向对象编程 javascript面向对象编程指南

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/108242.html

JavaScript设计模式与开发实践 | 01 - 面向对象的JavaScript

摘要：在中，并没有对抽象类和接口的支持。例如，当对象需要对象的能力时，可以有选择地把对象的构造器的原型指向对象，从而达到继承的效果。本节内容为设计模式与开发实践第一章笔记。动态类型语言编程语言按数据类型大体可以分为两类：静态类型语言与动态类型语言。静态类型语言在编译时已确定变量类型，动态类型语言的变量类型要到程序运行时，待变量被赋值后，才具有某种类型。而JavaScript是一门典型...

suxier 2019-08-21 10:44 评论0 收藏0
面向对象的JavaScript（如何一步步成为js高手）

摘要：虽然，也是面向疾苦的语言，但是，它和静态类型语言的面向接口编程不一而足。对象对他自己的行为负责，其他对象不关心它的内部实现。 ‘工欲善其事，必先利其器’，在深入学习JavaScript之前，我认为我们很有必要了解以下，JavaScript这门面向对象的动态语言到底是一门什么样的语言。 JavaScript vs 其他面向对象语言它没有使用像Java等传统的面向对象语言的类式继承，而...

peixn 2019-08-21 18:35 评论0 收藏0
理清javascript中的面向对象（一）——原型继承

摘要：有一函数若是用来生成对象，则称为构造函数名。属性指定了使用该构造函数生成的对象实例继承了哪个对象实例。因此，只要利用，就能在构造函数中，为未来利用此构造函数生成的对象实例，添加成员属性和成员方法了。与其它编程语言不一样的是，javascript的面向对象并非依赖于抽象的类，而是通过原型链，将一个个具体的对象实例进行连接，位于原型链下游的对象实例可以读取/使用位于上游的对象实例的属性/...

beita 2019-08-19 17:23 评论0 收藏0
浅谈JavaScript面向对象

摘要：不必在构造函数中定义对象实例的信息。其次，按照一切事物皆对象的这饿极本的面向对象的法则来说，类本身并不是一个对象，然而原型方式的构造函数和原型本身也是个对象。第二个问题就是在创建子类型的实例时，不能向超类型的构造函数中传递参数。前言对象(Object)应该算是js中最为重要的部分，也是js中非常难懂晦涩的一部分。更是面试以及框架设计中各出没。写这篇文章，主要参考与JavaScrip...

cyixlq 2019-08-21 17:15 评论0 收藏0
更好理解的面向对象的Javascript 1 —— 动态类型和多态

摘要：动态类型语言和鸭子类型编程语言按照数据类型大体可分为静态类型语言和动态类型语言。鸭子类型的概念至关重要，比如一个对象有了属性，也可以依照下标来存取属性，这个对象就可以被当做数组来使用。前言曾经对Javascript的面向对象相关知识也有过了解，从各种博客、书籍上也学到了很多。但是最近在看《Javascript设计模式与开发实战》这本书时发现该书对这方面的知识点介绍的很易于理解，因此...

shusen 2019-08-23 14:19 评论0 收藏0
JavaScript面向对象的程序设计

摘要：目录导语理解对象和面向对象的程序设计创建对象的方式的继承机制原型对象原型链与原型对象相关的方法小结导语前面的系列文章，基本把的核心知识点的基本语法标准库等章节讲解完本章开始进入核心知识点的高级部分面向对象的程序设计，这一部分的内容将会对对象目录导语 1.理解对象和面向对象的程序设计 2.创建对象的方式 3.JavaScript的继承机制 3.1 原型对象 3.2 原型链 3.3 与...

gitmilk 2019-08-20 13:30 评论0 收藏0