函数定义
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
//函数声明式定义方式
function myFun(){
console.log("hello world")
}
myFun()
</script>
</body>
</html>
函数默认参数与传参
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
//函数参数
function mySub(a,b){
console.log("a=>",a,"b=>",b)
return a-b
}
mySub(10,2)
// 传参调用
// 顺序传参
// 不支持关键字传参
//函数参数
function MySub(a,c,b=5,d){
console.log("a=>",a,"b=>",b,"c=>",c,"d=>",d)
return a-b
}
MySub(4,8)
MySub(4,8,10)
MySub(3,7,9,21)
</script>
</body>
</html>
![]()
函数的参数列表
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
//python中，通过*args接收未在函数的形参中定义的参数
//JavaScript：参数列表-arguments
function MySub(a,b){
console.log(a)
console.log(b)
console.log(arguments)
}
MySub(4,8)
</script>
</body>
</html>
![]()
函数表达式
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
//匿名函数 - 函数表达式
my_func = function(a){
console.log(a)
console.log(arguments)
}
my_func(4)
/*使用函数声明与使用函数表达式的区别：
函数声明会在调用之前已经加载好
函数表达式只有在执行代码时才会定义函数
*/
myhello()
function myhello(){
console.log("hello")
}
// myhell()
myhell = function(){
console.log("world")
}
myhell()
//定义多个同名函数，只有最后一个生效
function myfunc(a){
console.log("1")
}
function myfunc(a,b){
console.log("2")
}
function myfunc(a,b,c){
console.log("3")
}
myfunc()
</script>
</body>
</html>
![]()
函数的作用域
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
/*全局变量 - 当前页面所在窗口下的环境windows
页面之间的变量不能相互访问
*/
var myName = "chenwei"
//console.log("window.name")
function myfunc(){
console.log(myName)
}
// console.log("window.myfunc")
// cs5规范中并没有块级作用域,即诸如if,while的{},cs6有块级作用域
my_sex = "男"
function myFun(){
// 在函数内部使用var定义的变量,属于函数内部变量
var my_name = "chenwei06"
my_age = 29
console.log(my_name,my_sex)
}
myFun()
// 如果没有使用var关键词,变量就会声明为全局变量
function myfun(){
my_name = "chenwei06"
my_age = 29
console.log(my_name,my_age)
}
myfun()
console.log(my_name)
</script>
</body>
</html>
嵌套函数与闭包
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
//将函数作为返回值
function create_fun(I){
return function(){
return "func_"+I
}
}
func_array = []
for (i=0;i<=5;i++){
func_array[i] = create_fun(i)
}
</script>
</body>
</html>
![]()
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
// 闭包的原因:所有的函数都会输出five，而是使用了i值，而不是i值对应的value
function create_fun(){
var array = ["one","two","three","four","five"]
var func_array = []
for (i in array){
console.log(i)
func_array[i] = function(){
return array[i]
}
}
return func_array
}
func_array = create_fun()
func_array[0]()
</script>
</body>
</html>
![]()
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
function create_fun(){
var array = ["one","two","three","four","five"]
var func_array = []
for (i in array){
// console.log(i)
func_array[i] = function create_fun(I){
return function(){
return array[I]
}
#增加执行
}(i)
}
return func_array
}
func_array = create_fun()
func_array[0]()
</script>
</body>
</html>
![]()
函数作为参数
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
// 函数可以作为一个参数被另一个函数调用,另一个函数则为该函数的高阶函数
function sum(a,b){
return a+b
}
function sub(a,b){
return a-b
}
function compute(func,a,b){
return func(a,b)
}
value = compute(sum,10,3)
value = compute(sub,10,3)
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
function selectEvenNumber(number){
if (number % 2 == 0){
return number
} else {
return 0
}
}
function selectOddNumber(number){
if (number % 2 == 1){
return number
} else {
return 0
}
}
function map(array,func=selectEvenNumber){
for (i in array){
array[i] = func(array[i])
}
}
array = [1,2,3,4,20,6,7,25,45,15,9]
map(array)
console.log(array)
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
function selectEvenNumber(number){
if (number % 2 == 0){
return number
} else {
return 0
}
}
function selectOddNumber(number){
if (number % 2 == 1){
return number
} else {
return 0
}
}
function map(array,func=selectEvenNumber){
for (i in array){
array[i] = func(array[i])
}
}
array = [1,2,3,4,20,6,7,25,45,15,9]
map(array)
console.log(array)
// js中常见的高阶函数用法
function myfun(args,func){
myfunc(args,function(){})
}
</script>
</body>
</html>
![]()
回调函数
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
// callee代表这对函数自身的引用,可以降低函数名与内部调用的耦合性
function myFun(){
console.log(arguments)
console.log(arguments.callee)
}
// 利用递归计算阶乘
function factorial(num){
if (num == 1){
return 1
} else {
return num * factorial(num-1)
}
}
函数名变更,函数内部不需要修改
function factorial(num){
if (num == 1){
return 1
} else {
return num * arguments.callee(num-1)
}
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
// this 指向对象由所在的执行环境决定
console.log(this)
function myFun(){
console.log(this)
// return this
this.nickname = "luxp"
}
function MyFuns(){
function MyFunc(){
console.error(this)
return this
}
return MyFunc()
}
</script>
</body>
</html>
浙公网安备 33010602011771号