JS之函数的声明和调用

今天用markdown来写,方便写js代码,富文本不会用,今天有点愁,不说了,直接讲知识点!最下面还有面试一般会问的题!

函数

为什么要有函数?

在写代码的时候,有一些常用的代码需要书写多次,如果直接复制粘贴的话,会造成大量的冗余代码。

如果修改呢?? 多个页面呢??

函数可以封装一段重复的JavaScript代码,它只需要声明一次,就可以被多次调用。

重复代码、冗余代码的缺点:

1.代码重复,可阅读性差

2.不易维护,如果代码逻辑改变了,所有地方的代码都要跟着改变,效率太低。

使用场景 :  只要js出现的地方都有函数

函数的声明与调用

就相当于之前数组的创建和使用

声明函数的语法 :

function函数名() {

// 函数体

}

调用函数的语法 :

函数名

函数名()

特点:

1.函数声明的时候,函数体并不会执行,函数体只有在调用的时候,才会执行;

2.可以调用多次;

代码示例 :

// 声明函数

functionsayHi() {

console.log('萨瓦迪卡');

}

// 调用函数

sayHi();

函数的参数

​      function getSum() {

​        var a = 10;

​        var b = 20;

​        console.log(a+b);

  }

​      //  打印的是 10+20

​      getSum();

​      // 想打印 20+30?  怎么办????

​      getSum();

形参 ( 形式参数 ) : 在函数声明时, 设置的参数。作用是占位置 。只能在函数内部使用.

实参 ( 实际参数 ) : 在函数调用时,传入的参数。 作用 : 函数调用时,会把实参的值赋值给形参, 这样形参就有了值, 在函数体里,,,可以直接使用形参!

语法 :

//带参数的函数声明

function函数名(形参1,形参2,形参...){

//函数体

}

//带参数的函数调用

函数名(实参1,实参2,实参3);

如何确定形参:

在声明函数的时候,碰到不确定的值的时候,就可以定义成形参。

注意:

1.形参在声明时,值不固定,只有在调用的时候,形参的值才确定,形参的值会跟着函数调用时的实参不一样而不一样。

2.如何确定形参:在声明函数的时候,碰到不确定的值的时候,就可以定义成形参。

函数的返回值

当函数执行完的时候,我们期望函数给我一些反馈(比如计算的结果),这个时候可以让函数返回一些东西。也就是返回值。函数通过return返回一个返回值

返回值语法:

//声明一个带返回值的函数

function函数名(形参1,形参2,形参...){

//函数体

return返回值;

}

//可以通过变量来接收这个返回值

var变量=函数名(实参1,实参2,实参3);

函数返回值注意事项:

★return后面的语句不执行。

★函数可以没有返回值,函数如果没有return,那么返回结果是undefined。

★函数的参数可以有多个,但是返回值只能有1个。

函数三要素

函数三要素包括:函数名、参数、返回值

注意 : 参数和返回值可以没有,,,但是函数名一定要有;

函数内部可以调用函数

在函数内部是可以继续调用别的函数的。

functionchiFan() {

console.log('开始吃饭');

console.log('吃完了');

   }

functionqiaoDaiMa() {

console.log('开始敲代码');

chiFan()

console.log('代码敲完了');

   }

qiaoDaiMa()


递归函数

递归函数:自己直接或者间接调用自己的函数;  无限调用

注意 : 递归函数一定要留有出口,不然就是死循环了

递归函数比较抽象,尤其是第一次接触的同学们,大家了解即可。

斐波那契数列,有个人想知道,一年之内一对兔子能繁殖多少对?于是就筑了一道围墙把一对兔子关在里面。已知一对兔子每个月可以生一对小兔子,而一对兔子从出生后第3个月起每月生一对小兔子。假如一年内没有发生死亡现象,那么,一对兔子一年内(12个月)能繁殖成多少对?

//兔子的规律为数列,1,1,2,3,5,8,13,21 ,34 , 55, 89, 144

场景 : 少用,,性能也不太好!  100个月

函数也是一种类型

声明函数的两种方式

方式1 : 函数声明:

function函数名(){

//函数体

}

方式2 : 函数表达式 ( 匿名函数 )

var函数名=function(){

//函数体

}

函数可以作为参数

通常,我们把作为参数传递的函数叫做回调函数

functionfn1(fn) {

fn();

}

fn1(function(){

console.log("哈哈");

});

函数可以作为返回值

在js高级中,闭包会使用到。

functionfn1() {

returnfunction(){

console.log("呵呵");

   }

}

fn1()();//调用

作用域

作用域:变量起作用的区域

全局作用域 :在script标签内,函数外的区域就是全局作用域,在全局作用内声明的变量叫做全局变量 。全局变量可以在任意地方访问。

函数作用域 :在  函数内的区域  叫做函数作用域,在函数作用域内声明的变量叫做局部变量 ,局部变量只有在当前函数内才能访问到。

全局变量:在函数外,script标签内声明的变量就是全局变量,全局变量在任何地方都能访问的到。

局部变量:在函数中声明的变量,就是局部变量,局部变量只有在当前函数体内能够访问。

隐式全局变量:没有使用var定义的变量也是全局变量,叫做隐式全局变量。(不要使用)

总结 :

// 全局作用域 : script标签内, 函数外

//            全局变量 => 任何地方都可以访问

// 函数作用域 : 函数内部

//             局部变量 => `当前函数`内部

// 除了两个常用的变量还有 隐式全局变量 : 任何地方都能访问(前提是已经好)   (避免使用)(先执行函数)

// 查看哪些是全局、局部、隐式全局

// 计算

varnum=11;

functionfn() {

varnum1=12;

num2=22;

console.log(num);

console.log(num1);

}

fn();

console.log(num);

// console.log(num1);

console.log(num2);

变量的查找规则:

函数内部可以使用函数外部的变量  (见上例)

有局部变量就用局部变量,没有局部变量就用全局变量。 

预解析

​      console.log(num4);

​    // var num4 = '123';

js执行代码分为两个过程:

预解析过程(变量与函数提升)

代码一行一行执行

预解析过程:分别举例

// 预解析过程

// 1. 把var声明的变量提升到当前作用域最前面,不会提升赋值  var num = 19 ; var fn = function() {..}

// 2. 把函数声明 提升到当前作用域的最前面,,   function test() {....}

// 3. 如果函数同名 ???  后者会覆盖前者  (帅)

// 4. 如果 var声明的 和 函数声明的同名 ,  函数优先

面试题:(博主被问到过的面试题)

vara=4;

console.log(a);

a=6;

console.log(a);

functiona() {

console.log('哈');

   }

a();

a=10;

console.log(a);

匿名函数与自执行函数

匿名函数

匿名函数:没有名字的函数

匿名函数如何使用:

1.将匿名函数赋值给一个变量,这样就可以通过变量进行调用

2.自执行(匿名函数自执行)

匿名函数自执行的作用:防止全局变量污染。

// 自执行

(functionfn(){

console.log("我可以自己执行哦");

})();

//张三的代码

;(function(){

varnum=11;

functionfn() {

console.log("呵呵")

   }

fn();

console.log(num);

  })();

//李四的代码

注意:分号

// 注意点 : 代码规范

vara=10

varb=20

b=a

(function() {

console.log(b);

   })();

其实规范还是看各个大厂的要求,只要大厂内部统一风格就可以了!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,547评论 6 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,399评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,428评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,599评论 1 274
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,612评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,577评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,941评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,603评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,852评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,605评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,693评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,375评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,955评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,936评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,172评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 43,970评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,414评论 2 342

推荐阅读更多精彩内容

  • 函数和对象 1、函数 1.1 函数概述 函数对于任何一门语言来说都是核心的概念。通过函数可以封装任意多条语句,而且...
    道无虚阅读 4,521评论 0 5
  • 函数只定义一次,但可能被执行或调用任意次。JS函数是参数化的,函数的定义会包括一个称为形参的标识符列表,这些参数在...
    PySong阅读 512评论 0 0
  • 函数只定义一次,但可能被执行或调用任意次。JS函数是参数化的,函数的定义会包括一个称为形参的标识符列表,这些参数在...
    PySong阅读 842评论 0 0
  • 函数只定义一次,但可能被执行或调用任意次。JS函数是参数化的,函数的定义会包括一个称为形参的标识符列表,这些参数在...
    PySong阅读 308评论 0 0
  • 概要 64学时 3.5学分 章节安排 电子商务网站概况 HTML5+CSS3 JavaScript Node 电子...
    阿啊阿吖丁阅读 9,072评论 0 3