web前端-javascript中的函数(创建,参数,返回值,方法,函数作用域,立即执行函数)(代码片段)

苏凉.py 苏凉.py     2023-03-31     165

关键词:

🐚作者简介:苏凉(专注于网络爬虫,数据分析,正在学习前端的路上)
🐳博客主页:苏凉.py的博客
🌐系列专栏:web前端基础教程
👑名言警句:海阔凭鱼跃,天高任鸟飞。
📰要是觉得博主文章写的不错的话,还望大家三连支持一下呀!!!
👉关注✨点赞👍收藏📂

文章目录

简介

函数(Function

  • 函数也是一个对象
  • 函数中可以封装一些功能(代码),在需要时可以执行这些功能(代码)。
  • 函数中可以保存一些代码,在需要的时候调用。

函数的创建

在JavaScript中有三种方法来创建函数

  1. 构造函数创建
  2. 函数声明创建
  3. 函数表达式创建

其中第一种方法在实际使用中并不常用。创建函数之后需调用函数才可执行函数体内的代码。
函数的调用:

语法:函数名();

1 用构造函数创建

语法:var 函数名 = new Function(“语句;”)

使用new关键字创建一个函数,将要封装的功能(代码)以字符串的形式传递给封装函数,在调用函数时,封装的功能(代码)会按照顺序执行。

2 用函数声明创建

语法:function 函数名([形参1,形参2....])语句...

用函数声明显而易见的要简便许多,小括号中的形参视情况而写,语句写在中括号内。与构造函数不同的是不需要以字符串的形式写入。

3 用函数表达式创建

语法:var 变量(函数名)=function([形参1,形参2....])语句...;

函数表达式和函数声明的方式创建函数的方法相似,不同的是用函数表达式创建函数是将一个匿名函数赋值给一个变量,同时在语句结束后需加分号结尾。

函数的参数

  • 可以在函数的()中来指定一个或多个形参(形式参数)。
  • 多个形参之间使用,隔开,声明形参就相当于在函数内部声明了对应的变量但是并不赋值。
  • 调用函数时,可以在()中指定实参(实际参数),实参将会赋值给函数中对应的形参。

参数特性

1 调用函数时解析器不会检查实参的类型

函数的实参可以时任意数据类型,在调用函数时传递的实参解析器并不会检查实参的类型,因此需要注意,是否有可能接收到非法的参数,如果有可能则需要对参数进行类型的检查。

2 调用函数时解析器不会检查实参的数量

在调用函数传入实参时,解析器不会检查实参的数量,当实参数大于形参数时,多余实参不会被赋值。

当实参数小于形参数时,没有被赋值的形参为undefined。

3 当形参和实参过多,可以用一个对象封装

当形参和实参数量过多时,我们很容易将其顺序搞乱或者传递参数时出错,此时我们可以将数据封装在一个对象中,在进行实参传递时,传入该对象即可。

函数的返回值

可以使用return来设置函数的返回值

语法:return 值

  • return后的值将会作为函数的执行结果返回
  • 可以定义一个变量,来接收该结果。
  • 在return后的语句都不会执行。

若return后不跟任何值或者不写return,函数的返回值都是undefined。

另外,在函数体中return返回的是什么,变量接受的就是什么。

立即执行函数

  • 函数定义完,立即被调用,这种函数叫做立即执行函数
  • 立即执行函数往往只会执行一次
  • 通常为匿名函数的调用。

语法:(function(形参...)语句...)(实参...);

方法

对象的属性值可以时任意的数据类型,当属性值为一个函数时,在对象中调用该函数,就叫做调用该对象的方法。

函数作用域

  • 调用函数时创建函数作用域,函数执行完毕以后,函数作用域销毁
  • 每调用一次函数就会创建一个新的函数作用域,他们之间是互相独立的
  • 在函数作用域中可以访问到全局作用域的变量,在全局作用域中无法访问到函数作用域的变量
  • 当在函数作用域操作一个变量时,它会先在自身作用域中寻找,如果有就直接使用,如果没有则向上一级作用域中寻找,直到找到全局作用域,如果全局作用域中依然没有找到,则会报错ReferenceError

补充:JavaScript中的作用域相关概念

  • 作用域指一个变量的作用范围
  • 在JavaScript中有两种作用域1.全局作用域 2.函数作用域
  • 直接编写在script标签中的JS代码,都在全局作用域
  • 全局作用域在页面打开时创建,在页面关闭时销毁
  • 在全局作用域中有一个全局对象window它代表的是一个浏览器的窗口,它由浏览器创建我们可以直接使用

简而言之我们创建的全局变量都作为一个属性保存在window这个对象中。

而在函数中创建局部变量时,必须使用var关键字创建,否则为全局变量。

web前端-js入门(代码片段)

web前端-JS入门1.初识JavaScript1.1JavaScript的简单介绍1.2JS的三种写法1.2.1行内式1.2.2内嵌式1.2.3外部js1.3JS输入输出语句2.变量2.1变量使用2.2变量命名规范3.数据类型3.1数据类型的简介3.1.1介绍3.1.2数据类型的分类3.2简单数据类型3.2.1数字... 查看详情

javascript函数(代码片段)

函数语法格式创建函数函数调用参数个数函数表达式作用域总结作用域链语法格式创建函数//创建函数/函数声明/函数定义function函数名(形参列表)函数体return返回值;函数调用函数定义并不会执行函数体内容,必须要调用才会... 查看详情

javascript函数(代码片段)

函数语法格式创建函数函数调用参数个数函数表达式作用域总结作用域链语法格式创建函数//创建函数/函数声明/函数定义function函数名(形参列表)函数体return返回值;函数调用函数定义并不会执行函数体内容,必须要调用才会... 查看详情

前端知识图谱

...大全前端知识体系免费的编程中文书籍索引智能社-精通JavaScript开发重新介绍JavaScript(JS教程)麻省理工学院公开课:计算机科学及编程导论JavaScript中的this陷阱的最全收集–没有之一JS函数式编程指南Jav 查看详情

hgdb创建同名同参函数实现sqlserver中的dateadd函数

目录环境文档用途详细信息环境系统平台:Linuxx86-64RedHatEnterpriseLinux7版本:4.3.4.5文档用途SqlServer的内置函数DATEADD()在日期中添加或减去指定的时间间隔,HGDB中没有这个内置函数,可以通过编写同名同参的函数来... 查看详情

前端小小白的学习之路javascript中的十个难点,你有必要知道。

1.立即执行函数立即执行函数,即ImmediatelyInvokedFunctionExpression(IIFE),正如它的名字,就是创建函数的同时立即执行。它没有绑定任何事件,也无需等待任何异步操作:(function(){//代码//...})();function(){…}是一个匿名函数,包围... 查看详情

javascript函数(代码片段)

函数语法格式创建函数函数调用参数个数函数表达式作用域总结作用域链语法格式创建函数//创建函数/函数声明/函数定义function函数名(形参列表)函数体return返回值;函数调用函数定义并不会执行函数体内容,必须要调用才会... 查看详情

web前端开发笔记——第四章javascript程序设计第五节数组(代码片段)

...)数组的搜索六、数组的截取和合并一、数组的创建JavaScript中数组和其它语言不一样,它的一个数组中可以存放多种类型的元素,即数组每一项可以是任何一种数据类型的数据,且数组的大小是可以动态调整的&#x... 查看详情

Eloquent Javascript 中的 Javascript 函数

】EloquentJavascript中的Javascript函数【英文标题】:JavascriptfunctioninEloquentJavascript【发布时间】:2014-01-2015:49:43【问题描述】:greaterThanTen(9)如何成为返回函数中的y变量?我的意思是参数(9)如何成为返回函数参数中的y?自从greaterThan... 查看详情

web前端练习22----js中的原型对象prototype,原型链(重要)(代码片段)

原型对象 原理解析:我们创建的每一个函数,解析器都会向函数中添加一个属性prototype这个属性对应着一个对象,就是原型对象。如果函数作为普通函数,调用prototype没有任何作用当函数以构造函数的形式调用... 查看详情

好程序员web前端教程分享前端javascript练习题之promise

好程序员web前端教程分享前端javascript练习题之promisepromise-ajax的封装functionajax(url){//创建promise对象varpromise=newPromise(function(resolve,reject){//创建ajax对象if(window.XMLHttpRequest){varxhr=newXMLHttpRequest();}else{va 查看详情

web前端技术基础课程详解之javascript面向对象

JavaScript中的面向对象是个老生常谈的话题,但是依然有很多小伙伴处于懵逼状态。面试时候最担心的就是被问到面向对象相关的内容,自己看过无数的资料,依然对面向对象百思不得其解。到底什么是原型?什么是构造函数?... 查看详情

web前端技术基础课程详解之javascript面向对象

JavaScript中的面向对象是个老生常谈的话题,但是依然有很多小伙伴处于懵逼状态。面试时候最担心的就是被问到面向对象相关的内容,自己看过无数的资料,依然对面向对象百思不得其解。到底什么是原型?什么是构造函数?... 查看详情

web前端第六篇javascript对象

在JavaScript中除了null和undefined以外其他的数据类型都被定义成了对象,也可以用创建对象的方法定义变量,String、Math、Array、Date、RegExp都是JavaScript中重要的内置对象,在JavaScript程序大多数功能都是基于对象实现的<scriptlanguage=... 查看详情

javascript数组

创建数组在JavaScript多种方式创建数组构造函数1.无参构造函数,创建一空数组vara1=newArray();2.一个数字参数构造函数,指定数组长度(由于数组长度可以动态调整,作用并不大),创建指定长度的数组vara2=newArray(5);3.带有初始化数... 查看详情

web前端的javascript主要用于交互吗

web前端的javascript主要用于用户交互以及事件处理。主要作用如下:JavaScript常用来完成以下任务1、嵌入动态文本于HTML页面2、对浏览器事件作出响应3、读写HTML元素4、在数据被提交到服务器之前验证数据5、检测访客的浏览器信息... 查看详情

javascript中的构造函数

...象有一个属性constructor,这个属性指向创建该对象时所用的Javascript构造函数。house.constructor===Accom; 或者 houseinsta 查看详情

谁看了不得说声牛掰!前端大厂(字节腾讯阿里)力荐的javascript权威学习指南电子版

Javascript学习指南文档涵盖了javascript语言核心、词法结构、类型、值和变量、表达式和运算符、语句、对象、数组、函数、类和模块、正则表达式的模式匹配、javascript的子集和扩展、服务器端javascript/客户端javascript、web浏览器中... 查看详情