JavaScript (二) --- [基本语法之函数]

本文详细介绍了JavaScript中的函数定义、调用及其作用域,包括全局和局部变量的区别。同时,通过实例展示了如何在事件驱动中调用函数。此外,还讲解了全局函数`parseInt()`、`parseFloat()`和`typeof()`的用法,并提供了相关案例。
摘要由CSDN通过智能技术生成


函数


类似于面向对象语言中的方法;在JS中也具有实现某些功能的一些代码;被封装到函数中;可以反复调用.

函数是定义一次但却可以调用任意多次的一段完成某种特定功能的JS 代码。
函数中的语句是一个独立的部分,它不会在外部脚本执行时被执行,而只是作为函数的定义而存在。只有调用它时才执行。
函数调用是指通过函数名来使用这段代码。
函数在定义以后可以被重复调用,以此通常将常用的功能写成一个函数.


定义及调用函数


函数被关键字function声明;有函数名,函数参数列表,函数体,返回值;(不需要定义,参数以及返回值的类型)
基本语法:

function  functionName([arguments]){
javascript statements
[return expression]
} 

function: 声明函数的关键字;
functionName:函数名;
arguments:传递给函数的参数列表,各个参数之间用逗号隔开,可以为空;
statements: 实现函数功能的函数体;
return expression:函数将返回expression的值,同样是可选的的语句。

在调用函数时;可以直接调用;也可以在别的函数中调用;还可以通过对象调用.


案例:

<script type="text/javascript">	
 //函数案例name0;形式参数为 a;
 function name0( a){
        console.log(a);
        console.log("自定义的函数");
        //返回值不需要声明类型;
         return a+56;
		}
//调用函数;这个20就是实际传入的参数;
var  res=name0(20);
//获得返回值;
console.log(res);
</script>

在这里插入图片描述

可以使用事件驱动函数;


案例:在按钮事件中调用函数;

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
            //函数案例name0;形式参数为 a;
			function name0( a){
				console.log(a+10);
			}
		</script>
	</head>
	<body>
	    <!-- 在按钮事件中调用函数 -->
		<input type="button" onclick="name0(2)" value="按钮名" />
	</body>
</html>

点击一次按钮就会调用一下;

在这里插入图片描述


变量的作用域


全局变量:在函数外部定义的变量,在声明后,任何位置都可用。
局部变量:在函数内部定义的变量,作用范围为函数内部。
类似于面向对象语言的变量作用域

<script type="text/javascript">
			//全局变量a;
			var a=10;
			//函数;
			function name1(){
				//局部变量b;
				var b=6;
				console.log(b);
				console.log(a);
			} 
			name1();
</script>

全局函数


全局函数注释
parseInt(arg)把括号内的内容转换成整数之后的值,(可以把浮点数格式化为整数);如果参数是是字符串,则字符串开头的数字部分被转换成整数,如果以字母开头,则返回“NaN”。(遇到字母就不格式化了)
parseFloat(arg)把括号内的字符串转换成浮点数之后的值(也就是说会保留浮点数的小数部分),若参数为字符串类型;字符串开头的数字部分被转换成浮点数,如果以字母开头,则返回“NaN”。
typeof (arg)返回arg值的数据类型。(在实际应用中,可以判断数据的类型)
eval(arg)运算(把字符串可以作为js脚本执行)某个字符串。

案例:
parseInt(arg) 整数格式化

<script type="text/javascript">
			//parseInt(arg)案例;
			var   a=10;//整数类型的a;
			var   b=12.54;//浮点数类型的b;
			var   c="12";//字符串类型的整数c;
			var   d="12.33";//字符串类型的浮点数d;
			var   e="124qwq10";//字符串类型,以整数开头的e;
			var   f="124.55qwq10";//字符串类型,以浮点数开头的f;
			var   g="qaq";//字符串类型,以字母开头的g;
			
			console.log(a+b);            //整数与浮点数直接相加; 结果: 22.54
			console.log(a+parseInt(b)); //整数与 使用parseInt(arg)函数后的浮点数 相加;(浮点数b被格式化为整数;); 结果: 22
			console.log(a+c);           //整数与字符串类型的整数相加; 仅拼接了字符串; 结果: 1012
			console.log(a+parseInt(c)); //整数与 使用parseInt(arg)函数后的字符串类型整数 相加;(字符串类型的整数被格式化);结果: 22
			console.log(a+c*1);         //由于运算符的优先级;通过对字符串类型的整数进行隐式转换; 结果: 22
			console.log(a+d);          //整数与字符串类型的浮点数相加; 仅拼接了字符串; 结果: 1012.33
			console.log(a+parseInt(d));//整数与 使用parseInt(arg)函数后的字符串类型浮点数 相加;(字符串类型的浮点数被格式化);结果: 22
			console.log(parseInt(e));  //使用parseInt(arg)函数后的字符串类型,以整数开头的e;  结果:124
			console.log(parseInt(f));  //使用parseInt(arg)函数后的字符串类型,以浮点数开头的f;结果:124
			console.log(parseInt(g));  //使用parseInt(arg)函数后的字符串类型;以字母开头的g; 结果:NaN
</script>

parseFloat(arg) 浮点数格式化

<script type="text/javascript">
			//parseFloat(arg)案例;
			var   a=10;//整数类型的a;
			var   b=12.54;//浮点数类型的b;
			var   c="12";//字符串类型的整数c;
			var   d="12.33";//字符串类型的浮点数d;
			var   e="124qwq10";//字符串类型,以整数开头的e;
			var   f="124.55qwq10";//字符串类型,以浮点数开头的f;
			var   g="qaq";//字符串类型,以字母开头的g;
			
			//使用parseFloat(arg)浮点数格式化函数;
			console.log(parseFloat(a));//整数类型的;                结果:10
			console.log(parseFloat(b));//浮点数类型的;              结果:12.54
			console.log(parseFloat(c));//字符串类型的整数;          结果:12
			console.log(parseFloat(d));//字符串类型的浮点数;        结果:12.33
			console.log(parseFloat(e));//字符串类型,以整数开头的;   结果:124
			console.log(parseFloat(f));//字符串类型,以浮点数开头的; 结果:124.55
			console.log(parseFloat(g));//字符串类型,以字母开头的;   结果:NaN
</script>

typeof (arg)判断数据类型

<script type="text/javascript">
			//typeof (arg)返回arg值的数据类型。
			var   a=10;//整数类型的a;
			var   b=3.1415926;//浮点数类型的b;
			var   c="10qwer";//字符串类型的c;
			var   d; //未赋值的变量d;即未知类型的;
			var   f=new Date();//对象类型的f;
		
			//使用typeof (arg)判断变量类型;
			console.log(typeof(a));//结果: number
			console.log(typeof(b));//结果: number
			console.log(typeof(c));//结果: string 
			console.log(typeof(d));//结果: undefined
			console.log(typeof(f));//结果: object
</script>

eval(arg) 可以把字符串当做js语言执行

<script type="text/javascript">
//eval(arg)  可运算(把字符串可以作为js脚本执行)某个字符串。
			//案例;
			var a=10;
			var b="a+a+17";
			//使用eval(arg);可运算字符串;
			console.log(eval(b));
			eval("alert('对话框');");//虽然这里的对话框是作为字符串类型;但是会被执行(弹出对话框);		
</script>


  • 7
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 4
    评论
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

小智RE0

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值