1.函数使用分为两步:声明函数 和 调用函数
1.声明函数
function 函数名 ( ){
函数体
}
(1)function 是声明函数的关键字 全部小写
(2)函数是做某件事情,函数名一般为动词 sayHi
(3)函数不调用,自己不执行
2.调用函数
函数名();
// 函数名
function sayHi(){
// 函数体
console.log('你好');
}
// 函数名();
sayHi();
调用函数的时候不要忘记加小括号()
2.函数的使用
2.1 声明函数
function 函数名 (){
函数体代码
}
· function 是声明函数的关键字 必须小写
· 由于函数一般是为了实现某种功能才定义的,所以通常我们将函数名命名为动词,比如getSum
2.2 调用函数
函数名();通过函数名来执行函数体代码
· 调用函数时千万不要忘记添加小括号
· 口诀:函数不调用,代码自己不执行
注意:声明函数本身不会执行代码,只有调用函数时才会执行代码体代码
2.3函数的封装
· 函数的封装是把一个或多个功能通过函数的方式封装起来,对外只提供一个简单的函数接口
· 简单理解:封装类似于将电脑配件整合组装到机箱中(类似快递打包)
例题:用函数求1~100的累加和
function sayNum(){
var arr = 0;
for (var i = 0 ; i <= 100 ; i++){
arr += i ;
}
}
sayNum();
3.函数的参数
函数的参数分为实参 和 形参
在声明函数时,可以在函数名称后面的小括号中添加一些参数,这些参数被称为形参,而在调用该函数时,同样也需要传递相应的参数,这些参数被称为实参。
形参主要用于接收实参
// 形参
function cook(aru){
console.log(aru);
}
// 实参
cook('参数1');
cook("参数2");
可以理解为cook内的 形参=实参 类似于变量赋值
函数的参数可以有,也可以没有,也可以多个,多个参数之间要用 , 逗号隔开
参数的作用:在函数内部某些值不能固定的时候,我们可以通过参数在调用函数时传递不同的值进去
小例题:
1.利用函数求任意两个值的和
function newArr (num1,num2){
console.log(num1+num2);
}
var a = prompt("第一个数")*1;
var b = prompt("第二个数")*1;
newArr(a,b);
2.利用函数求任意两个值之间的和
function getSums (num1,num2){
var sum = 0;
for (i = num1 ; i<=num2 ; i++){
sum += i;
}
console.log(sum);
}
var a = prompt("第一个数")*1;
var b = prompt("第二个数")*1;
getSums(a,b);
小结:
函数可以带参数也可以不带参数
声明函数的时候,函数名括号里面的是形参,形参的默认值为undefined
调用函数的时候,函数名括号里面的是实参
多个参数中间用逗号分离
形参的个数可以和实参个数不匹配,但结果不可预计,我们要尽量匹配
4.函数的返回值
4.1return 语句
1.函数是做某件事或实现某种功能
function cook(arr){
console.log(arr);
}
cook('雷霆嘎巴');
2.函数的返回格式
function 函数名(){
return 需要返回的结果;
}
函数名();
(1)我们函数只是实现某种功能,最终结果需要返回给函数的调用者函数名()通过return 实现
(2)只要遇到 return 就把后面的结果 返回给函数的调用者 函数名( ) = return后面的结果
3.代码验证
function cook(){
return 666;
}
console.log(cook());
这边我们可以看到,我们跟1.是完全不一样的,在第一的例题的时候,我们不应该把输出语句直接在函数内部中输出,而是返回给函数的调用者,所以第一例题是不完整的,接下来我们再做几个例题,详细了解
4.1求任意两个数的和
// 照常的num1+num2
function newArr (num1,num2){
// 我们在函数内部直接把内容返回给函数的调用者(实参)
return num1 + num2;
}
var a = prompt('数字1')*1;
var b = prompt('数字2')*1;
// newArr()括号内是自定义数值,
// 这边我使用弹窗输入自定义
// num1 = a;
// num2 = b;
console.log(newArr(a , b));
4.2比较两个值的大小
function newArr(num1,num2){
if(num1>num2){
return num1;
}else{
return num2;
}
}
var a = prompt('数字1')*1;
var b = prompt('数字2')*1;
console.log(newArr(a,b));
三目运算:
function newArr(num1,num2){
return num1 > num2 ? num1 : num2;
}
var a = prompt('数字1')*1;
var b = prompt('数字2')*1;
console.log(newArr(a,b));
4.3利用函数求数组[2,4,56,77,8,4,43,5,46,76]的最大值
function newArr (arr){
// 申请一个变量,将arr内第一个值
// 索引号为0的值拿出来进行比较
var max = arr[0]
// i从1开始是因为0已经被max变量拿走比较了
for (var i = 1; i < arr.length; i++) {
// 用if判断进行比较
if(arr[i]>max){
max = arr[i];
}
}
// 直接返还给调用
return max;
}
// 这是时候是不是以为要
// console.log(newArr([2,4,56,77,8,4,43,5,46,76]));
// 错 ! 我们有更简单的
//我们这边赋值个变量
var re = newArr([2,4,56,77,8,4,43,5,46,76]);
//输出到控制台
console.log(re);
// 是不是更简单了!
// 因为我们在实际开发中,经常用一个变量来接收函数的返回结果 使用更简单
4.2 return 终止函数
return 语句之后的代码不被执行
1.return 终止函数
function newArr(num1,num2){
return num1+num2;
//aler 俺因为排在return后面,没办法执行了,蓝廋,香菇!
alert('老八秘制');
}
a = newArr(2,3);
console.log(a);
2.return 只能返回一个值
function newArr(num1,num2){
return num1,num2;//返回的结果只能返回最后一个值
}
console.log(newArr(2,3));
3.求任意两个数的 加减乘除
function newArr(num1,num2){
// 因为他的结果只能返回最后一个值
// 一个数组会被当一个结果来看,所以这边我们用数组
return [num1+num2,num1-num2,num1*num2,num1/num2];
}
var news = newArr(2,4);
console.log(news);
//如果我们要用数组的话我们就遍历出来就可以了
4.函数没有 return 返回 undefined
我们的函数如果有return 则返回的是 return 后面的值 如果函数没有 return 则返回 undefined
function newArrs(){
return 666;
}
console.log(newArrs());//他返回的是 666
function newArrs(){
}
console.log(newArrs()); //他返回的是 undefined
函数都是有返回值的
1.如果有 return 则返回 return 后面的值
2.如果没有 return 则返回 undefined
5.arguments 的使用
当我们不确定有多少个参数传递的时候,可以用 arguments 来获取。在JavaScirpt中,arguments实际上他是当前函数的一个内置对象。所有函数都内置了一个arguments对象中存储了传递的所有实参。
只有函数才有 arguments 对象 而且每个函数都内置好了 arguments
内置就好比你买了部手机,里面的打电话,发信息的功能都给你配置好了
function newArrs(){
// 当我们不知道会传几个实参过来的时候
// 我们就用 arguments 他就会识别出来
// 里面存储的所有实参
console.log(arguments);
}
newArrs(1,2,3)
在控制台我们可以看到他有一个中括号,这就证明
arguments展示形式是一个伪数组,因此可以进行遍历,同时伪数组具有几个特点为:
伪数组并不是真正的数组
1.具有length属性
function newArrs(){
console.log(arguments.length);
}
newArrs(1,2,3)
2.按索引方式储存数据
function newArrs(){
console.log(arguments[3]);
}
newArrs(1,2,3,4)
3.不具有数组的 push( ),pop ( )等方法
4.我们可以按照数组的方式遍历arguments
function newArrs(){
for (var i = 0 ; i < arguments.length ; i++){
console.log(arguments[i]);
}
}
newArrs(1,2,3,4,5,6)
小结:
1.arguments 是我们所有函数都内置的对象 他的作用里面都存放了所有用户传来的实参
2.当我们不知道用户传来的实参有多少值的时候使用arguments
小练习:
1.利用函数求任意个数最大的值
function newArrs (){
var max = arguments[0];
for (var i = 0; i < arguments.length; i++) {
max = arguments[i]
}
return max
}
console.log(newArrs(1,2,34,46));
2.利用函数反转任意数组
function reverse(arr){
// 创建一个空数组
var newArr = [];
// 因为索引值是从0开始的所以用 i=arr的长度减 1和 i--
for(var i = arr.length - 1; i >= 0; i--){
//这是要把旧数组的最后一个放到新数组里面去,依次进行遍历
newArr[newArr.length] = arr[i]
}
// 再输出数组
return newArr;
}
// 用变量来简化最后只需要输出arr1
var arr1 = reverse([1,2,3,4,5,6,7,8,9,])
console.log(arr1);
reverse翻转
3.利用函数封装方式,对数组排序--冒泡排序
function sort(arr){
// 外层循环控制循环次数,
for(var i = 0; i < arr.length - 1; i++){
// 内层循环比较大小 -i是循环出本次循环的最大值,
并放在本次循环最后最后就不用再循环他
// -1是剪掉索引号,让她从索引号 0变成 1
for(var j = 0; j< arr.length - i - 1; j++){
// 如果前面的比后面的大,就交换
if (arr[j] > arr[j + 1]){
// 申请变量接收交换的数值
// 前面的数比后面的大就交换位置
var temp = arr[j];
arr[j] = arr[j + 1];
arr[j + 1] = temp;
}
}
}
return arr;
}
var arr1 = sort([43,121,3454,32,23,54,6,5231,2]);
console.log(arr1);
sort 排序
4.利用函数判断闰年
function newArr(year){
// 如果是闰年就返回 true 不是则返回 false
var flag = false;
if (year % 4 == 0 && year % 100 != 0 || year % 400 ==0){
flag = true;
}
return flag;
}
var arr = prompt("请输入年份")
console.log(newArr(arr));
6.函数调用另外一个函数
因为每个函数都是独立的代码块,用于完成特殊任务,因此经常会用到函数互相调用的情况
例:
function backDay(){
var arr = prompt("请输入年份:");
// newArr()调用了函数,在里面更改为我们的变量名
if(newArr(arr)){
alert('当前年份是闰年,2月有29天');
}else{
alert('当前年份是平年,2月有28天');
}
}
backDay();
function newArr(year){
// 如果是闰年就返回 true 不是则返回 false
var flag = false;
if (year % 4 == 0 && year % 100 != 0 || year % 400 ==0){
flag = true;
}
return flag;
}
通过backDay调用函数调用 var arr = prompt("请输入年份"),然后进行判断 if(newArr(arr))因为他调用了,所以代码会到下方函数先执行判断条件是否可行,可行就返回上方函数继续判断是否为闰年和平年,润年就执行第一个表达式,平年就执行平年表达式,这样就省去了很多麻烦,以后我们用到的时候直接调用就可以了
调用注意调用名
函数的两种声明方式:
1.利用函数关键字自定义函数(命名函数)
function fn( ) {
}
fn( );
2.函数表达式(匿名函数)
var 变量名 = function( ){
console.log("匿名函数")
}
变量名();
(1)函数表达式跟声明变量差不多,只不过变量里面存的是值,而函数表达式里面存的是函数
(2)函数表达式也可以进行传递参数