马上注册,结交更多好友,享用更多功能^_^
您需要 登录 才可以下载或查看,没有账号?立即注册
x
本帖最后由 yanghongchen666 于 2021-2-15 07:20 编辑
Js中的函数简介:
函数:
-函数也是一个对象
-函数可以封装功能(代码),在需要的时候可以调用该功能(代码)
-使用typeof检查一个函数对象时,会返回object
//我们在实际开发中很少使用构造函数来创建一个函数对象
//创建一个函数对象
//可以将要封装的代码以字符串的形式传递给函数
var fun = new Function("console.log('Hello 这是我的第一个函数');");
//封装到函数中的代码不会立即执行
//函数中的代码会在函数调用的时候执行
//调用函数 语法: 函数对象()
//当调用函数时,函数中分装的代码会按照顺序执行
fun();
fun.hello = "你好";
console.log(fun.hello);
函数声明创建函数:
语法:
function 函数名(形参1,形参2,形参3.....){
语句.....
}
注:改function括号里面的形参不是必须要写的,是可选
例子:
function fun2(){
console.log("这是我第二个函数");
alert("函数太好用了!!!");
}
//这里如果想输出fun2函数中的内容我们需要调用函数fun2();
fun2();
函数表达式:
语法:
var 函数名 = function(形参1,形参2,形参3.....){
语句....
}
例子:
//该函数也称之为[b]匿名函数[/b],因为这个函数并没用名字,只是函数赋值给了fun3
var fun3 = function(){
console.log("我是匿名函数")
}
-------------------------------------------------------------
JS函数的参数
上面相信大家已经了解了函数是个什么东西,也明白了大概要怎么写这时候可能就有聪明的小宝贝就要问了:
那个那个既然函数能传形参,那么形参是干嘛的鸭~ 既然你大发慈悲的问了,我就在这里给你解答啦!
废话不多说直接上例子!
例子1:
/*
定义一个用来求和的两个数和的函数
可以在函数的()中来指定一个或多个形参(形式参数)
多个形参之间使用,隔开,声明形参就相当于在函数内部声明了对应的变量
但是并不赋值
*/
function sum(num1,num2){
console.log("result = " num1 + num2)
}
/*
在调用函数时,可以在()中指定实参(实际参数)
实参将会赋值给函数中对应的形参
*/
sum(2,3); //输出结果为5
//看到这里可能有聪明的小宝贝就要问了,那如果我不传数字而是其他值会怎么样呢?(请看下面的解释)
/*
这里我们形参2传入了hello,明显是个字符串类型所以这说明了
调用函数时解析器不会检查实参的类型
所以要注意,是否可能会接受非法的参数,如果有的话则需要对参数进行类型的检查
函数的实参可以使用任意数据类型
*/
sum(123,"hello");
//我们来如果我们的传入多余的实参会怎么
/*
调用函数时,解析器也不会检查实参的数量
多余的实参,不会被赋值
如果实参的数量少于形参的数量,则没有对应实参的形参将是undefined
*/
sum(123,true,"你好");
//这里除了前两个123,456以为后面的值都为undefined
sum(123,456,"Hello",true,null)
这里补充一点,实参的值可以是任何的值,也可以是一个对象或者是一个函数
例子:
/*
创建一个函数,可以在控制台中输出一个人的信息
可以输出人的name age gender address
实参可以使任意的数据类型,也可以是一个对象
当我们的参数过多时,可以将参数封装到一个对象中,
然后我们通过对象传递
*/
function sayHello(o){
console.log("我是"+o.name+"今年我"+o.age+"岁了"+"我是一个"+o.gender+"人"+"我住在"+o.address);
}
//sayHello("孙悟空",18,"猴","花果山")
//创建对象
var obj = {
name : "孙悟空",
age : 18,
gender : "男",
address : "花果山"
}
//sayHello(info)
/*
实参可以是一个对象,也可以是一个函数
*/
function fun(a){
console.log("a = "+a);
/*这里的a是sayHello函数,可以理解为在这里调用了
sayHello(obj) 因为现在的a是sayHello
*/
a(obj)
}
fun(sayHello);
fun(function(){alert("hello")});
fun(area(10));
/*
area()
-调用函数
-相当于使用的是函数的返回值
area
-函数对象
-相当于直接使用函数对象
不加括号传的是对象
加括号传的是函数返回值
*/
----------------------------------------------------------
Js函数的返回值
/*
创建一个函数,用来计算三个数的和
可以使用return 来设置函数的返回值
语法:
return 值/变量
return后的值将会作为函数的执行结果返回,
可以定义一个变量,来接受该结果
在函数中return后的语句都不会执行
如果return语句后不跟任何值,就相当于返回一个undefined
如果函数中不写return,也会返回undefined
return后可以跟任意类型的值
*/
例子:
function sum(num1,num2,num3){
var number = num1 + num2 + num3;
return number;
//因为在alert之前已经return所以这里alert不会生效
alert("hello")
}
//这里我们调用sum函数,并传入实参1,10,15
sum(1,10,15);
函数的返回值也是可以返回任何数据类型的
例子:
//返回值为对象
function fun(){
//返回对象
return {name:"孙悟空"};
}
fun();//调用函数fun
//返回值是函数
function fun2(){
//在函数里创建一个函数
function fun3(){
alert("我是内部函数fun3~~");
}
//将fun3作为fun2函数的返回值返回
return fun4;
}
a = fun3();
//console.log(a);
a();
fun3()();//这种写法跟上面是一样的,这不过这里没有创建变量而是直接调用
--------------------------------------------
Js中的匿名函数
例子:
//这里在function外面用小括号包住,来声明它是一个整体,不用括号包住会报错
/*
立即执行函数
函数定义完,立即被调用,这种函数叫做立即执行函数
立即执行函数往往只会执行一次
*/
(function(){
alert("我是一个匿名函数");
}) (); //直接使用();来调用函数
(function(a,b){
console.log("a = "+a);
console.log("b = "+b);
}) (123,456);
------------------------------------------
Js中的方法
方法其实跟函数没有任何区别,两者之间只是名称上的区别
函数也可以成为对象的属性,如果一个函数作为一个对象的属性保存,
那么我们称这个函数是这个对象的方法 调用这个函数就说调用对象的方法(method)
例子:
//创建一个对象
var obj = new Object();
obj.name = "Tom";
obj.sayNmae = function(){
alert(obj.name)
}
//调用方法
obj.sayNmae()
//这里我们也可以理解为,在对象中保存的函数,当我们调用时就称之为方法
---------------------------------------
JS中枚举对象中的方法
个人感觉Js中枚举方法的用法跟python for语句的结构基本一样,
废话不多说直接上代码!
这里需要介绍一个新的结构
for...in语句
语法:
for(var 变量 in 对象){
语句....
}
for...in语句: 对象中有几个属性,循环体就会执行几次
每次执行时,会将对象中的一个属性名赋值给变量
例子:
var obj = {
name:"tim",
age:18,
gender:"男",
address:"洛杉矶"
};
for(var n in obj){
console.log("属性名: " + n);
//这里输出属性值的时候,切记要有中括号,不然obj.n的意思是在obj对象中搜索名为n的属性名
console.log("属性值: " + obj.[n];
}
-----------------------------------------
Js中的作用域
变量的声明提前
-使用var关键字声明的变量,会在所有的代码执行之前被声明(但是不会赋值),
但是如果声明变量时不使用var关键字,则变量不会提前声明
函数的声明提前
-使用函数申明形式创建的函数function 函数名(){}
它会在所有的代码执行之前就被创建,所以我们可以在函数声明前来调用函数
-使用函数表达式创建的函数,不会被声明提前,所以不能再声明前调用
例子:
var a ;
console.log("a = " + a);
a = 123;
//fun();
//函数声明,会被提前创建
function fun(){
console.log("我是一个fun函数");
}
//函数表达式,不会被提前创建
var fun2 = function(){
console.log("我是一个fun2函数");
}
//fun2();
fun2();
全局作用域:
-作用域指一个变量的作用的范围
-在JS中一共有两种作用域:
1.全局作用域
-直接编写在script标签中的JS代码,都在全局作用域
-全局作用域在页面打开时创建,在页面关闭时销毁
-在全局作用域中有一个全局对象windown,
它代表的是一个浏览器的窗口,它由我们浏览器创建我们可以直接使用
-在全局作用域中,创建的变量都会作为window对象的属性保存
创建的函数都会作为window对象的方法保存
-全局作用域中的变量都是全局变量,在页面的任意的部分都可以访问的到
例子:
var a= 10;
var b = 20;
var c = "hello";
console.log(window.a);
function fun(){
console.log("我是fun函数");
}
//window.fun();
window.alert("hello");
函数作用域:
函数作用域
-调用函数时创建函数作用域,函数执行完毕以后,函数作用域销毁
-每调用一次函数就会创建一个新的函数作用于,他们之间是互相独立的
-在函数作用域中,可以访问到全局作用域的变量,
在全局作用域中无法访问到函数作用于的变量
-当在函数作用于中才做一个变量时,它会在自身作用域中寻找,如果有就直接使用
如果没有则向上一级作用域中寻找,直到找到全局作用域,
如果全局作用域中依然没有找到,则会报错ReferenceError
-在函数中要访问全局的变量则可以使用window对象
举一些例子:
//创建一个变量
var a = 10;
function fun(){
var a = "我是fun函数中的变量a";
var b = 20;
console.log("a = " + a);
function fun2(){
//这里加上window,访问的是全局作用域中的a,如果不加window则访问就近的a
console.log("a = " + window.a);
}
fun2();
}
fun();//a输出为我是函数中的变量a
console.log("a = " + a);//a输出为10
/*
在函数作用域中也有声明提前的特性,
使用var关键字声明的变量,会在函数中所有的代码执行之前被声明
函数声明也会在函数中所有的代码执行之前执行
*/
function fun3(){
fun4();
console.log(a);
var a = 35;
function fun4(){
alert("我是fun4");
}
}
fun3();
var c = 33;
/*
在函数中,不使用var声明的变量都会成为全局变量
*/
function fun5(){
console.log("c = " + c);
c = 10;
//d没有使用var关键字,则会设置为全局变量
d = 100;
}
fun5();
//在全局输出C
console.log("d = " +d);
var e = 23;
/*
定义形参就相当于在函数作用域中声明了变量
*/
function fun6(e){
alert(e);
}
fun6();
---------------------------------------
写在最后....由于这一章东西比较多,也不太好自己出练习题,希望大家能消化一下这次的东西,特别是函数跟作用域要搞明白
可以自己创建一些函数来玩一玩...基础语法估计最多还有两三章左右啦~这是继python一来第二门语言,虽然python学的也一般,
|