JavaScript之函数
2018-03-01 本文已影响2人
追逐_chase

函数
函数声明
- 函数:一段可以反复调用的代码块。函数还能接受输入的参数,不同的参数会返回不同的值。
- 格式如下:
function 函数名字( 参数1,参数2){
执行语句
}
调用: 函数名称()
- 命名规范:只能是字母、数字、下划线、美元符号,不能以数字开头。
<script type="text/javascript">
//调用函数
sayHello();
//声明函数
function sayHello() {
console.log("您好。欢迎您")
}
</script>
函数表达式
- 除了 function 声明函数意外,还可以使用变量赋值的写法命名函数,我们成为函数表达式(器
本质
就是将一个匿名函数
赋值给一个变量) - 在语句结束的时候必须 要有 分号 ;
<script type="text/javascript">
//匿名函数
function () {
console.log("这是一个匿名函数");
}
//赋值给变量--> 函数表达式
var fuc = function (a) {
console.log(a)
};
fuc("哈哈")
</script>
函数名的提升---预解析
- JavaScript 引擎将函数名视同变量名,所以采用function命令声明函数时,整个函数会像变量声明一样,被提升到代码头部
- 预解析会分段(多对的script标签之间函数重名没有影响)
// script标签1
<script type="text/javascript">
f1();
function f1 () {
console.log("看看");
}
</script>
// script标签2
<script type="text/javascript">
f1();
function f1 () {
console.log("这还是");
}
</script>
- 注意:如果采用赋值语句定义函数,变量提升后,在运行的时候JavaScript 就会报错(函数表达式)
//变量提升 没有问题
f();
function f() {}
// 变量提升 有问题
f1();
var f1 = function (){};
// TypeError: undefined is not a function
//解释
//预解析
var f1;
f1(); //报错
f1= function (){};
- 在函数体内部,声明变量,会把该声明提升到函数体的最顶端。 只提升变量声明,不赋值。
<script type="text/javascript">
var num = 10;
func();
function func() {
console.log(num);
var num = 20;
}
</script>
//结果是: undefined
相当于这样的代码
<script type="text/javascript">
var num = 10;
func();
function func() {
//变量提升到头部
var num;
console.log(num);
num = 20;
}
</script>
- 注意:全局隐式函数
f1();
console.log(c);//9
console.log(b);//9
console.log(a); //报错
function f1 () {
var a = b = c = 9; //b,c是隐式函数 全局
console.log(a); // 9
console.log(b); //9
console.log(c);//9
}
//解释 函数f1内部的变量 只有 a是var声明的 局部变量 b和c是隐式全局变量
function f1 () {
var a = 9;
b = 9;
c = 9;
console.log(a); // 9
console.log(b); //9
console.log(c);//9
}
函数的参数 和 返回值
参数
- arguments是存储了函数传送过来实参 ,是一个伪数组;
- Javascript在创建函数的同时,会在函数内部创建一个arguments对象实例.
- arguments对象只有函数开始时才可用。函数的 arguments 对象并不是一个数组,访问单个参数的方式与访问数组元素的方式相同
- arguments对象的长度是由实参个数而不是形参个数决定的
<script type="text/javascript">
sayHello("你是?","哈哈");
function sayHello(a,b) {
console.log(arguments.length);
console.log(a + b)
}
</script>
//打印结果:
2
你是?哈哈
返回值
//返回值
var c = sum(10,20);
console.log(c)
//打印结果: 30
//定义函数
function sum(num1,num2) {
return num1 + num2
}
- 函数可以参数传入函数
- 函数可以作为返回值 返回
作用域
-
全局变量:声明的变量是使用var声明的,那么这个变量就是全局变量,全局变量可以在页面的任何位置使用
-除了函数以外,其他的任何位置定义的变量都是全局变量 -
全局作用域:全局变量的使用范围
-
局部变量:在函数内部定义的变量,是局部变量,外面不能使用
-
局部作用域:局部变量的使用范围
-
隐式全局变量:声明的变量没有var,就叫隐式全局变量
function fn () {
//隐式全局变量
num = 100;
};
fn(); //调用
console.log(num);
作用域链

- 如上图一样,在调用f1函数时, 输入函数 log在寻找num的变量时,是从函数内部,也是上3级作用开始 向外部寻找,如有num就输入,没有就报错。
函数递归
- 函数中调用函数自己,此时就是递归,递归一定要有结束的条件
- 递归求和
//递归求和
function getSum (x) {
//如果 x是1的话 返回1
if (x == 1) {
return 1;
}
return x + getSum(x -1);
}
console.log(getSum(5)); ===》 15

- 每个数字之和 比如:123 1+2+3 = 6
//求出个位数 然后相加
function getEverySum (x) {
if (x < 10) {
return x;
}
//获取这个数字的个位数 一直获取个位 相加
return x%10 + getEverySum(parseInt(x/10));
}
console.log(getEverySum(136));