函数调用与封装

一、 函数调用
构成函数的js代码在定义的时候,并不会执行,只有调用该函数的时候,它们才会执行,调用函数有4种方法:
² 作为函数调用
² 作为方法调用
² 作为构造函数 //最后两个不做为现阶段需要掌握的内容介绍。
² 通过它们的call()和apply()方法间接调用
1. 作为函数调用:
调用函数表达(或者函数声明)式可以进行普通的函数调用。
var a = 10,b = 20;
var add=function(){
var c = a+b;
return c;
}
console.log(add());
函数声明:
var a = 10,b = 20;
function add(){
var c = a+b;
return c;
}
2. 方法调用
函数和方法本质上是一类东西,只不过函数是属于全局对象window的方法,他可以直接用函数名进行调用;而其它对象的方法,则不可以这样调用,只能被对象进行调用。
观察上面的事例,无论是函数声明还是函数表达式,都可以被全局对象window调用实现:
console.log(window.add());
console.log(add());  //两种调用方式,展示出的结论是一样的,充分证明声明的函数就是window对象的方法。
但是,属于其它对象的方法,就不能单独使用名称调用:
var arr = [];
var a = 10,b = 20;
arr.add = function(){//add方法此时属于arr对象
var c = a+b;
return c;
}
console.log(arr.add());//其它对象的方法,只属于这个对象,只能被这个对象调用
console.log(add());//报错,单独调用不可以
console.log(window.add());//其它对象也无法调用
注意:哪怕生成两个值一模一样的对象,但是他们也不是同一个东西,他们的方法不能互相调用,只属于自己。
var arr1 = [];
var arr2 = [];
var a = 10,b = 20;
arr1.add = function(){
var c = a+b;
return c;
}
console.log(arr1.add());
console.log(arr2.add());
3. 方法调用中的方法链
如果一个方法的返回值是对象,那么这个返回值依然可以调用它自己的方法,形成方法的链式调用。
var jim = {
name:"jim",
age:15,
myName:function (){
return jim.name;
}
}
var student = {
1001:jim,
stu : function(){
return student[1001];
}
}
var obj = student.stu();
console.log(obj.myName());
以上obj就是student.stu()的返回值,也就是对象jim;于是可以修改代码为:
console.log(student.stu().myName());
二、 函数封装
1. 函数封装概念
函数封装是一种函数的功能,它把程序员写的一个或者多个功能通过函数的方式封装起来,对外只提供一个简单的函数接口(其实所说接口就是方法)。
比如说,数组遍历:
var arr = [1,2,3,4,5];
for (var i = 0; i < arr.length; i++) {
console.log(arr[i])
}
以上写法只能实现一个数组的遍历,当我们有很多数组需要遍历的时候,只能复制for循环,重写代码来实现。可它们明明是一样的代码,知识数组不同,这样会产生很大的冗余。
于是我们可以将for循环封装到一个函数中,在遇到需要数组遍历的时候,只要引入并调用这个函数即可实现任何数组的遍历。
var arr1 = [1,2,3,4,5];
var arr2 = [9,8,7,6,5,4];
function arrbl(arr){
for (var i = 0; i < arr.length; i++) {
console.log(arr[i])
}
}
//遍历arr1
arrbl(arr1);
//遍历arr2
arrbl(arr2);
这个和我们之前使用的数组方法有异曲同工之妙,但是原理并不相同,不要混为一谈。
封装函数的三个要素;
功能、参数、返回值。
实际在运用函数封装的过程中,有许多情况我们会设置返回值,这是一种很好的操作,当然如果不需要的话,可以不设置。
2. 函数封装事例
2.1 封装奇偶数判断方法
function isOuShu(num){
if(num%2==0){
return true;
}else{
return false;
}
2.2 自然数之和
function sumfromNToM(n,m){
var sum = 0;
for(var i=n;i<=m;i++){
sum=sum+i;
}
return sum;
}
2.3 判断闰年
function isLeapYear(year){
if((year%4==0 && year%100!=0)||(year%400==0)){
return true;
}
return false;
}
 
2.4 生成4位的验证码
function getFourNum(){
var str="";
for(var i=0;i<4;i++){
str += parseInt(Math.random()*10);
}
return str;
}
 

posted @ 2021-08-11 11:13  壮壮姐姐~  阅读(751)  评论(0编辑  收藏  举报