Function

1.函数的产生方式:

1.自定义函数

function fn(){}; fn();  

2.函数表达式

var fn=function(){}; fn(); 

3.new Function

var f1=new Function("num","for(var i=0;i<100;i++){sum+=i}return sum;"); 
2.函数的调用方式

1.自定义函数调用

function fn(){};  fn();

2.函数表达式

var fn=function(){}; fn();

3.构造函数调用

function Foo(){};
var fn=new Foo();

4.call,apply调用
function foo(){};
foo.call();
foo.apply();

函数的三种角色

1.普通函数

function (){}; 

2.构造函数

funtion To(){};    var t1=new To();

3.对象

    function fo () {};
    fo.info="蜘蛛";
    fo.num=123;
   fo.showName=function(){console.log(112)};
    console.log(fo.info);
   fo.showName();

function Person(name,age){
    this.name=name;
    this.age=age;
    console.log(123);
};
Person();<普通函数>
Person.showAge=function(){
        console.log(456);
}<函数作为对象>
Person.showAge();
var p1=new Person('Jerry',23);<作为构造函数>
3.函数作为参数
function  fn(f){
     var obj={
        info:'Jerry';
    };
    f(obj);
  };
  var fo=function(date){
      console.log(date.info);
  }
fn(fo);

        function foo(obj){
                var data={
                    name:'kitty',
                    fn2:function(o){
                    console.log(o.info);
                 }
      };
                obj.fn(data);
       };
    var fn1=function(data){
          console.log(data.name);
                  data.fn2(o);
        };
      var o={
              info:'Jerry',
             fn:fn1
      };
     foo(o);

  function fn(o){
        console.log(o.info);
        var data={
                name:''Kitty'
        }
      o.fn(data);
 }
 fn({
      info:'Jerry',
      fn:function(data){
          console.log(data.name);
    }
  });
函数作为返回值;

最主要用于,排序问题上面;

var arr=[12,31,43,54];
var fn=function(a,b){
      return a-b;
}
console.log(arr.sort(fn));  

  var arr0 = [{name:'a',age:12,salary:111},{name:'c',age:16,salary:123},{name:'g',age:13,salary:123},{name:'v',age:15,salary:345},{name:'p',age:19,salary:456}];<那么对象怎么排序:>

function fn(sortName){
    return function(o1,o2){
            var v1=o1[sortName];
            var v2=o2[sortName];
        if(v1>v2){return 1}else if(v1<v2){return -1}else{return 0};
  }
}
var c1=arr0.sort(fn('age'));
(好好的理解一下上面,用函数字做返回值的案例);
作用域

作用域:全局作用域,函数作用域;

全局作用域
abc=123;
var info=456;
this.name="Jerry";
delete abc;
function foo(){
    console.log(abc);
    console.log(info);
    console.log(name);
}
foo();
用var声明的关键字不能被delete删除,没有用var声明的全局变量可以被delete删除;
delete 删除对象的属性;
函数作用域
函数作用域中的属性只能在函数内部访问;
function fo(){
      var abc=123;
      console.log(abc);
}
fo();//123;
console.log(abc);//underfind;

javaScript中没有块级作用域的概念;

预解析

1.预解析的优先级:函数>参数>变量;

function fo(){
    console.log(a);//undefind;
    var a=123;
    console.log(a);//123;
}
fo();

function fo(){
    console.log(a);
    var a=123;
    function a(){
      console.log(a);
  }
    console.log(a);
}
fo();

  function foo(a){
      var a=123;
      console.log(a);//456;
  }   
  foo(456);

  function foo(a){
        console.log(a);
        var a=123;
        function a(){
            console.log(a);
        }
        console.log(a);
  }
 foo(456);

执行流程:foo这个函数调用然后传参,但是函数内部有a这个函数,函数作用域内预解析的时候,函数的优先级最高,然后变量a=123;重新给参数赋值,然后第二个console.log(a)的值就是123;

作用域链条

作用域链条:其实就是函数的嵌套,访问变量的规则就是从里到外,逐一访问的;
var a = 10;
function foo(){
var b = 20;
function fn1(){
var d = 40;
b = 21;
function fn2(){
var e = 12;
console.log(d);
}
}
fn1();
function fn(){
var c = 30;
console.log(a + b + c);
}
fn();
}
foo();

闭包

闭包:简单的说就是可以访问到函数内部的变量;
作用:1.访问函数内部的变量;2.缓存中间状态值;
副作用:造成空间的浪费;

缓存中间状态值;

 var arr=[];
for(var i=0;i<3;i++){
      arr[i]=(function(n){
              var k=n;
              return function(){
                   console.log(k);
         }  
  })(i);
}
arr[0]/()/0; 
arr[1]/()/1; 
arr[2]/()/2;

自执行函数

var fn=(function (){
        var num=0;
        return function (){
            console.log(num++);
  }
})();
fn();

访问函数内部的变量;
function foo(a){
var money=10000;
return money*a;

}
var f1=foo(0.01);

投票点赞功能

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>投票点赞</title>
</head>
<body>
    <script>
    window.onload=function  () {
        var adiv=document.getElementById("div1");
        var oinput=document.getElementsByTagName('input');
        for(var i=0;i<oinput.length;i++){
            oinput[i].onclick=(function(){
                        var num=0;
                        return function(){
                            alert(num++);
                        }
            })();
        }
    };

第二种方法:
var adiv=document.getElementById("div1");
var oinput=document.getElementsByTagName('input');

        for(var i=0;i<oinput.length;i++){
            oinput[i].num=0;
            oinput[i].onclick=function(){
                        
                    alert(this.num++);
            }
        }
    };          
    </script>
    <div id="div1">
        <input type="button"  value="点击"/>
        <input type="button"  value="点击"/>
        <input type="button"  value="点击"/>
        <input type="button"  value="点击"/>
        <input type="button"  value="点击"/>
        <input type="button"  value="点击"/>
        <input type="button"  value="点击"/>
        <input type="button"  value="点击"/>
        <input type="button"  value="点击"/>
        <input type="button"  value="点击"/>
    </div>
</body>
</html>
事件队列机制

js运行是单线程的;如果遇见一下事件(定时函数<延时到期>,事件函数<事件触发>,ajax函数<服务端返回数据>),事件会被放到事件队列当中,当这两个条件都满足了,才会触发事件队列中的事件,1.主线程已经空闲;2.特定的条件已经完成;

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 200,045评论 5 468
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 84,114评论 2 377
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 147,120评论 0 332
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 53,902评论 1 272
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 62,828评论 5 360
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,132评论 1 277
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,590评论 3 390
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,258评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,408评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,335评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,385评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,068评论 3 315
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,660评论 3 303
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,747评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,967评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,406评论 2 346
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 41,970评论 2 341

推荐阅读更多精彩内容