### 函数 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. 跟UI自动化测试有关的技术

    大家都知道,针对UI的自动化技术一般要支持下列的东西: 1. 识别窗口   能够识别尽量多的窗口种类,支持尽量多的UI技术.比如Win32.WinForm.WPF以及WebPage(这个比较特殊,确切 ...

  2. js沉思录一:js的核心概念

    js的核心概念: 原型.对象(Object).函数(Function); 原型:路由路径上非叶子结点的对象: 对象:无序属性(包括函数)的集合: 函数:函数上下文的集合: 原型: 原型的创建.指定.修 ...

  3. Codechef August Challenge 2019 Chef and Gordon Ramsay

    [传送门] 题目即求所有的三元组,相对大小关系同 $p_1,p_2,p_3$. 题解说都很清楚,这里写一下过程整理一下思路. 如果我们枚举中间这个元素,那么就是统计子树内外有多少个大于这个数和小于这个 ...

  4. scala 学习笔记--模式匹配

    1.switch java代码 switch (cause) { case ‘2‘ : dropTime=time; case ‘8’:case ‘9’ : case ‘10’:case ‘11’ : ...

  5. 选择排序之python实现

    def findsmallestindex(arr): smallnum = arr[0] smallindex = 0 # 寻找最小元素的位置 for i in range(1,len(arr)): ...

  6. from表格

    目录 from 功能: 表单元素 表单工作原理: input 属性说明: select标签 属性说明: label标签 属性说明: from 功能: 表单用于向服务器传输数据,从而实现用户与Web服务 ...

  7. rancher2基础环境配置

    一.主机配置 1.配置要求 参考节点要求 2.主机名配置 因为K8S的规定,主机名只支持包含 - 和 .(中横线和点)两种特殊符号,并且主机名不能出现重复. 3.Hosts 配置每台主机的hosts( ...

  8. 禁用F12,屏蔽鼠标右击、

    $(document).ready(function(){ $(document).bind("contextmenu",function(e){ return false; }) ...

  9. Guava Cache 缓存实现与源码分析

    目录 一.概述 1.内存缓存 2.核心数据结构 二.具体实现 0.一览众山小 1.CacheBuilder 构建器 2.LocalCache 一.概述 1.内存缓存 可看作一个jdk7的concurr ...

  10. 【Beta】Phylab 测试报告

    PhyLab Beta 测试报告 测试中发现的bug Beta阶段新Bug Bug 可能原因 markdown生成的报告可能溢出显示框 表格过长,显示框未设置横向溢出 移动端实验区无法评论 移动端社区 ...