命名函数创建
// 在当前函数所在script标签创建时,优先将该函数存储在堆中,并且函数名存储在栈中
// 当前这个代码所在的script标签的上面的script的标签中任意函数和全局变量都是可以被调用的
// 但是当前代码所在的script标签下面的script的标签中函数和全局变量是不可以调用的
// 函数名:驼峰式命名法,首字母一般都是小写,如果该函数是构造函数,函数名首字母需要大写
// 函数后面的()是执行当前函数需要传入参数内容
// {}里面是函数的语句块,当执行函数时,该语句的内容就会被执行
// function fn(a,b){
// console.log(a+b);
// }
// fn(3,4)
// 匿名函数
// 代码运行到定义匿名函数后才可以调用该匿名函数
/* var fn=function(){
} */
/* (function(){
// 自执行函数
})(); */
// 构造函数定义函数
// 可以动态构建函数
// var fn=new Function("a","b","console.log(a+b)");
// fn(3,5);
/*
函数外的变量,在函数中可以调用到
var a=10;
function fn(){
console.log(a);
}
fn();
*/
/*
函数内定义的变量不能被函数外调用
function fn(){
var a=10;
// 在函数内使用var定义的变量就是局部变量
// 在函数外用var定义的变量就是全局变量。
// 不使用var直接给一个变量赋值就是相当于给window增加一个属性,那么这个属性也是全局变量
}
fn();
console.log(a); */
/* var是定义变量,如果在函数中没有用var定义变量,直接使用变量,该变量是全局变量
function fn(){
a=10;
}
fn();
console.log(a); */
// this===window
// var b=10;
/* function fn(){
// window被省略了,如果没有使用var定义变量,就意味着直接在window对象下增加这个属性
a=10;
}
fn();
console.log(a); */
/* var a=10;
function fn(){
var a=5;
console.log(a);//5
// 有局部变量时,先调用局部变量,没有局部变量才带哦用全局变量
}
fn();
console.log(a);//10 */
/* var a=10;
function fn(){
// 在函数中任意位置使用var定义的变量,在该函数的任意位置都认为该变量是局部变量
console.log(a);//undefined
var a=5;
}
fn();
console.log(a);//10 */
/* var a=10;
function fn(){
var a=20;
// console.log(a+window.a);
console.log(a+this.a);
}
fn(); */
// function fn(a){
// // console.log(a);
// // 参数就是局部变量
// }
// fn(5);
/*
var a=10;
function fn(a){
console.log(a);//5
var a=20;
// 这里相当于重新定义了一个局部变量a
}
fn(5); */
/*
var a=5;
function fn(){
var a=10;
function fn1(){
var b=20;
var a=100;
console.log(a);
}
fn1();
console.log(b);
} */
/* a(a);//a都是全局变量,下面a=10还没有运行,所以在这里全局变量就是函数a,我们把函数a当前参数填入
var a=10;//覆盖了函数a,函数a在这里也是全局变量
function a(a){
console.log(a);
var a=10;
} */
// a(a);
/*
var a;
a(a);
a=5;
function a(a){
console.log(a);
var a=10;
} */
function fn(a,b){
// a,b是参数,参数可以是任意内容,如果没有对应填入,该参数就是undefined
// 执行函数时,填入的参数就相当于给参数赋值
// js是一个弱类型语言,因此,参数不能强制约定类型
// ES5中不能设置参数的默认值
console.log(a+b);
}
*/
// fn(3);
// 执行函数时填入值与函数参数顺序是一一对应关系
/* function fn(obj){
// 相当于给obj赋值一个o,obj和o的引用地址相同
// 当修改obj的属性时,全局的o属性也会被修改
obj.a=10;
}
var o={a:1};
fn(o); */
/* function fn(obj){
// 重新设置了obj的新的引用地址
obj={
a:3
}
}
var o={a:1};
fn(o); */
// 回调函数
/* function fn(f){
var a=10;
f(a);
}
function fn1(a){
console.log(a+10);
}
function fn2(a){
console.log(a+100);
}
function fn3(a){
console.log(a+1000);
}
fn(fn2); */
// 如果参数的数量不确定,就不设置参数(ES5);
/* function getMaxValue(){
// console.log(arguments);//ES5以上版本时尽量少用,arguments参数集
if(arguments.length===0) return;
var max=arguments[0];
for(var i=1;i<arguments.length;i++){
max=max>arguments[i] ? max : arguments[i];
}
console.log(max);
}
getMaxValue(1,4,7,2,3,10); */
/* function getMaxValue(){
// console.log(arguments.callee);//该函数自己
// console.log(arguments.callee.caller);
}
getMaxValue(1,3,5,7);
*/
// 递归
/* var i=0
function fn(){
i++;
if(i<10) fn();
}
fn();
console.log(i); */
/*
用于匿名函数中调用自身函数
var i=0;
(function(){
i++;
if(i<10) arguments.callee();
})();
console.log(i); */
var i=0;
function fn1(f){
console.log("a");
f();
}
function fn3(f){
console.log("c");
f();
}
function fn2(){
// 调用当前函数的环境函数
// console.log(arguments.callee.caller);
console.log("b");
i++;
if(i<10) arguments.callee.caller(arguments.callee);
}
// 耦合
fn3(fn2);
/* var w, c;
init();
function init() {
for (var i = 0; i < 50; i++) {
w = Math.random() * 50 + 50;
c = randomColor();
createDiv(w, w, c);
}
}
function createDiv(_width, _height, _color) {
var str = "";
str += "<div style='";
str += "width:" + _width + "px;";
str += "height:" + _height + "px;";
str += "background-color:" + _color + ";";
str += "position:absolute;";
str += "left:" + Math.random() * 1000 + "px;";
str += "top:" + Math.random() * 600 + "px;";
str += "'></div>";
document.write(str);
}
function randomColor() {
var color = "#";
for (var i = 0; i < 6; i++) {
color += parseInt(Math.random() * 16).toString(16);
}
return color;
} */
return 阻断
/* var disc=0,bool=false;
init();
function init() {
var div = document.getElementById("div0");
div.style.width = "50px";
div.style.height = "50px";
div.style.backgroundColor = "red";
div.style.position = "absolute";
div.style.left="0px";
div.onclick=function(){
bool=!bool;
}
setInterval(anmiation,16,div);
}
function anmiation(div){
if(!bool) return;
disc++;
div.style.left=disc+"px";
} */
// return break continue
// return 只能使用在函数中,函数外不能使用,无视任何内容直接跳出函数
// break 用于switch或者循环语句中,跳出当前循环或者锚点循环,或者switch语句,循环外的语句继续执行
// continue 仅跳出当前次循环,继续下一次循环,只能用于循环语句中
// 如果在函数最后一句没有返回值的情况下,尽量不要写return
/* function fn(){
for(var i=0;i<10;i++){
if(i===5) return;
}
console.log("a");
}
fn(); */
// return 有时候可以替代break
// return 返回值
// 可以允许函数返回一个值,仅一个。。
/* function fn(){
return "a";
} */
// 函数在执行时,将会返回一个结果,如果函数中没有return,就会返回undefined
/* var s=fn();
console.log(s); */
function randomColor(alpha){
// 如果没有参数,随机
alpha=alpha==undefined ? Math.random().toFixed(2) : alpha;
// 传入的参数转换为数值
alpha=Number(alpha);
// 如果传入的参数是非数值,就让透明度为1
if(isNaN(alpha))alpha=1;
var color="rgba(";
for(var i=0;i<3;i++){
color+=parseInt(Math.random()*256)+",";
}
color+=alpha+")";
return color;
}
console.log(randomColor(false));
// 中文时间,return完成多分支条件语句
var arr=["零","一","二","三","四","五","六","七","八","九"];
// console.log(arr[5])
// var str="123";
// console.log(str[0],str[1],str[2])
/* 5 "五";
10 "十";
15 "十五";
20 "二十";
36 "三十六";
100 "一百";
105 "一百零五";
110 "一百一十";
135 "一百三十五";
350 "三百五十"; */
/*
function getCNNumber(n){
if(n<0 || n>1000) return “错误的消息”;
if(n<10) return arr[n];
if(n=10) return “十”;
if(n<20) return “十”+arr[String(n)[1]];
if(n>=100 && n%100=0) return arr[String(n)[0]]+“百”;
if(n>100 && n%10=0) return arr[String(n)[0]]+“百”+arr[String(n)[1]]+“十”;
if(n%10=0) return arr[String(n)[0]]+“十”;
if(n<100) return arr[String(n)[0]]+“十”+arr[String(n)[1]];
if(n%100<10) return arr[String(n)[0]]+“百零”+arr[String(n)[2]];
return arr[String(n)[0]]+“百”+arr[String(n)[1]]+“十”+arr[String(n)[2]];
}
console.log(getCNNumber(345)); */
// return 返回对象
// 可以返回多个值
/* function fn(w,h){
// var perimeter=(w+h)*2;
// var area=w*h;
return {
perimeter:(w+h)*2,
area:w*h
}
}
console.log(fn(5,6)); */
/*
function fn(o){
o=o || {};
o.a=10;
o.b=20;
return o;
}
var obj=fn({a:1});
console.log(obj); */
// 每次执行函数创建一个新对象 工厂模式
/* function fn(){
var o={};
o.a=10;
o.b=20;
return o;
}
console.log(fn()===fn()); */
// 单例
/* var o;
function fn(){
o=o || {};
o.a=10;
o.b=20;
return o;
}
console.log(fn()===fn());
console.log(fn()); */
// 返回函数
// 返回函数执行的结果
/* function fn(){
return fn1();
}
function fn1(){
return 1;
}
console.log(fn()); */
// 返回函数体
// 闭包
/* function fn(n){
return function(m){
// console.log(n+m);
return n+m;
}
} */
// var f=fn();
// f();
// console.log(fn(3)(5));
/*
for(var i=0;i<5;i++){
var div=document.getElementById(“div”+i);
div.οnclick=clickhandler;
}
var text=document.getElementById(“text”);
function clickhandler(){
// console.log(this.innerHTML);
text.value=this.innerHTML
} */
回调函数
/* function callBack(){
}
setInterval(callBack,1000); */
/* function fn1(f){
f();
}
function fn2(){
console.log("aaa");
}
fn1(fn2); */
/* var i=0;
function fn1(f){
console.log("a");
f(fn1);
console.log(i);
}
function fn2(f){
i++;
console.log("b");
if(i<6000) f(fn2);
}
fn1(fn2); */
// 堆栈溢出 递归或者回调的次数过多,没有阻止递归或者回调的条件
实列红绿灯
function getLight(first,second,third){
first(second,third);
}
function getRedLight(fn,fn1){
var f=arguments.callee;
var ids=setTimeout(function(){
console.log("红灯");
clearTimeout(ids);
fn(fn1,f);
},1000);
}
function getYellowLight(fn,fn1){
var f=arguments.callee;
var ids=setTimeout(function(){
console.log("黄灯");
clearTimeout(ids);
fn(fn1,f);
},1000);
}
function getGreenLight(fn,fn1){
var f=arguments.callee;
var ids=setTimeout(function(){
console.log("绿灯");
clearTimeout(ids);
fn(fn1,f);
},1000);
}
// getRedLight(getYellowLight,getGreenLight);
getLight(getGreenLight,getYellowLight,getRedLight)