### 函数 function
> 在js中函数就是一个方法(一个功能体)基于这个函数,一般是为了实现某个功能。
```
var total =10;
total+=10;
total=total/2;
total=total.toFixed(2);//保留小数点后面2位(数字有一个方法toFixed用来保留小数点后面的位数)
...
在后续的代码中,我们依然想实现相同的操作(加10除以2),需要重新编写
//=>这样导致代码大量冗余,不利于开发,降低了开发效率。如果进行对这个功能的代码封装,后期执行即可。
```
**`函数诞生的目的就是实现封装`:把实现一个功能的代码封装到一个函数中,后期想要实现这个功能,只需要把这个函数执行即可,不必要再次编写重复代码,起到了"`低耦合高内聚`(减少页面冗余代码,提高代码的重复使用率)"`的作用**
```javascript封装
function fn(){
var total=10;
total+=10;
total/=2; == (total=total/2)
total=total.toFixed(2);
console.log(total);
}
fn();
fn();
...
想用多少次我们就执行多少次函数即可
====
ES3标准中:
//=>创建函数
function 函数名 ( [参数] ){
函数体:实现功能的js代码
}
//=>函数执行
函数名();
====
ES6标准中:
//=>创建函数
let 函数名(变量名) = ([参数]) =>{
函数体
}
函数名();
例如:
let fn=()=>{
let total=10;
};
fn();
```
函数作为引用数据类型中的一种,它也是按照引用地址来操作的,接下来学习函数运行机制:
**`函数运作机制`:**
```
var obj = {
name:'前端' ,
age:9
};
function fn(){
var total=10;
total+=10;
total/=2; == (total=total/2)
total=total.toFixed(2);
console.log(total);
}
fn();
 
1.函数也是引用类型,首先会开辟一个新的堆内存,把函数体中的代码当做“字符串”存储到内存中(对象向内存中存储的是键值对)
2.把开辟的堆内存地址赋值给函数名(变量名)
此时我们输出fn(切记不是fn())代表当前函数本身,如果我们执行fn(),这是把函数执行,所以是否加小括号是两种不同本质的操作
【函数执行的目的】
目的:把之前存储到堆内存的代码字符串变成真正的js代码自上向下执行,从而实现应有的功能。
1.函数执行首先会形成一个私有的作用域(一个供代码执行的环境,也是一个栈内存)
2.把之前在堆内存中存储的字符串复制一份过来,变成真正的js代码,在新开辟的作用域中自上而下执行
```
`js中的三座大山:1.堆栈内存寄闭包 2.面向对象 3.异步编程`
### 函数中的参数
> 参数是函数的入口: 当我们在函数中封装一个功能,发现一些原材料不确定,需要执行函数的时候用户传递进来才可以,此时我们基于参数的机制,提供出入口即可。
```
//=>此处的参数叫形参:入口,形参是变量(n/m就是变量)
function sum(n,m) {
//=>n和m分别对应要求和的两个数字
var total=0;
total=n+m;
console.log(total);
}
//=>此处函数执行传递的值是实参:实参是具体的数据值 10,20
sum(10,20); //=>n=10,m=20
sum(10); //=>n=10,m=underfined
sum(); //=>n和m都是underfined
sum(10,20,30);//=>n=10,m=20, 30没有形参变量接受
```

JS系列:函数function的更多相关文章

  1. js的函数-function

    function函数 function的英文是[功能],[数] 函数:职责:盛大的集会的意思 在js里,就是函数的意思.在Java里叫做方法. 定义函数 function fun(参数){ //函数体 ...

  2. JavaScript系列----函数(Function)篇(4)

    1.什么是函数? 在W3C中函数的定义是这么说的:函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块.   诚然,从这种抽象的定义中我们得不到什么有价值的东西.下面,举例来列举出函数的几种定义 ...

  3. 自定义JS Map 函数

    // 自定义JS Map 函数 function Map() { var map = function (key, value) {//键值对 this.key = key; this.value = ...

  4. js 深入原理讲解系列-currying function

    js 深入原理讲解系列-currying function 能看懂这一题你就掌握了 js 科里函数的核心原理 不要专业的术语,说人话,讲明白! Q: 实现 sum 函数使得以下表达式的值正确 cons ...

  5. Js函数function基础理解

    正文:我们知道,在js中,函数实际上是一个对象,每个函数都是Function类型的实例,并且都与其他引用类型一样具有属性和方法.因此,函数名实际上是指向函数对象的指针,不与某个函数绑定.在常见的两种定 ...

  6. Node.js系列基础学习-----回调函数,异步

    Node.js基础学习 Node.js回调函数 Node.js异步编程的直接体现就是回调,异步编程依托回调来实现,但不是异步.回调函数在完成任务后就会被调用,Node有很多的回调函数,其所有的API都 ...

  7. js中使用function定义类、实例化,函数的调用方法

    function Test002(name, age){ name, age, this.printInfo = function(){ //定义的公有方法 console.log(name, age ...

  8. js立即执行函数: (function ( ){...})( ) 与 (function ( ){...}( ))

    ( function(){…} )() ( function (){…} () ) 是两种javascript立即执行函数的常见写法,最初我以为是一个括号包裹匿名函数,再在后面加个括号调用函数,最后达 ...

  9. 在webView 中使用JS 调用 Android / IOS的函数 Function

    最近做一个项目,混合了NativeCode 和 HTML,为了便于JS 调用App的一些方法,统一封装一个Js方法,记录如下 Android 端首先要再WebView中允许JS的调用 WebView ...

随机推荐

  1. c语言的#和##的用法

    #include <stdio.h> #define ADD(A,B) printf(#A " + " #B " = %d\n",((A)+(B)) ...

  2. 套接字编程简介: IPV4套接字地址结构/ 通用套接字地址结构/ IPV6套接字地址结构/新通用套接字地址结构

    IPv4套接字地址结构通常也称为“网际套接字地址结构”,它以sockaddr_in命名,定义在<netinet/in.h>头文件中. struct in_addr { in_addr_t ...

  3. python 类的倒入

    test.pyclass sss: def ddd(self): print("hello") test2.pyfrom testone import sss

  4. lintcode-720重排带整数字符串

    题目描述: 给一包含大写字母和整数(从 0 到 9)的字符串, 试写一函数返回有序的字母以及数字和. 样例 给出 str = AC2BEW3, 返回 ABCEW5字母按字母表的顺序排列, 接着是整数的 ...

  5. 模拟30A 题解

    A. 树 联想起远古考试时做的题 记忆的轮廓. 树上走一些步数的期望. 显然可以直接解方程. 然而复杂度$O(qn^3)$,利用树上的性质优化一下, 直接一遍dfs过程中解出来,可以$O(qnlogm ...

  6. 自顶向下深入分析Netty(三)--Bootstrap

    自顶向下深入分析Netty(一)--预备知识 自顶向下深入分析Netty(二)--线程模型 自顶向下深入分析Netty(三)--Bootstrap 自顶向下深入分析Netty(四)--EventLoo ...

  7. WordPress入门 之 设置导航菜单

    WordPress 3.0 添加了一个自定义导航菜单的功能,让你可以很自由地设置网站的导航菜单.现在大多数的主题也都支持这个功能了,那么,究竟该如何设置WordPress导航菜单?今天倡萌就介绍一下. ...

  8. [Web] How to Test React and MobX with Jest

    转载自: https://semaphoreci.com/community/tutorials/how-to-test-react-and-mobx-with-jest?utm_content=bu ...

  9. Xshell 服务器配置

    1.新建链接  2.配置公网IP  3.输入用户名和密码

  10. python dlib学习(五):比对人脸

    前言在前面的博客中介绍了,如何使用dlib标定人脸(python dlib学习(一):人脸检测),提取68个特征点(python dlib学习(二):人脸特征点标定).这次要在这两个工作的基础之上,将 ...