1 1.函数作为参数传给其他函数：
2 data.sort(function(a,b){return a-b})
3 //关于数组的sort函数，其回调函数返回负值，a在b之前
4 //正值，b在a之前
5
6 2.函数定义好后立即调用
7 var temp=(function(x){return x*x})(10);
8
9 function foo(){};//函数声明，可以提前
10 var foo=function(){};//表达式定义函数，不能提前
11
12 3.JAVASCRIPT的函数可以嵌套在其他函数里面
13 function hy(a,b){
14 function square(x){return x*x;}
15 return Math.sqrt(square(a)+square(b));
16 }
17
18 4.函数声明语句并非真正的语句，他们可以出现在全局代码里，或者内嵌在其他函数内，
19 但是它们并不能出现在循环，条件判断或者try/catch语句中。
20 但函数定义表达式可以出现在javascript的任何地方
21
22 5.jquery的方法链式调用原理
23 $(":header").map(function(){return this.id;}).get().set();
24 当方法不需要返回值时，建议将其返回值定为return this;
25 这样就可以实现方法的链式调用。
26
27 6.嵌套函数中this的指向问题
28 var o={
29 m:function(){
30 var This=this;
31 f();
32
33 function f(){
34 console.log(this);
35 console.log(This);
36 }
37 }
38 };
39 o.m();
40 以上示例中，对象o内定义了函数m()，在函数m()内定义函数f()并调用
41 在f内的this并不指向调用外层函数的上下文，而是指向全局对象
42 其返回值：
43
44 Window Html001.html//严格模式下返回undefined
45 Object { m=function()}
46
47 7.构造函数的调用
48 如果在函数或者方法调用前带有关键字new，就形成了构造函数调用
49 var o=new Object();
50 var o=new Object;//没有形参时可以省略掉Object后面的括号
51 一旦使用了new关键字调用构造函数，构造函数内的this就会指向new出来的新对象
52 var o={
53 m:function(){
54 var This=this;
55 f();
56
57 function f(){
58 //console.log(this);
59 console.log(This===o);
60 }
61 }
62 };
63 new o.m();//函数内部this不指向上下文，也就是不指向o
64
65 8.间接调用，call()与aplly()
66 允许函数显示的指定函数运行的域，也就是规定this的指向
67 foo.call(obj1,args1...)；
68 foo.apply(obj2,arg[...]);
69
70 9.函数调用的形参与实参
71 function foo(arg1,arg2,arg3....){}
72
73 foo(arg1);
74 如果函数调用时传入的实参比函数定义时的形参数要少，则多的形参被定义为undefined
75 这个特性可用来实现类似函数重载的功能
76
77 function getPropertyName(o,/*可选参数，数组a*/arr) {
78 // body...
79 var arr=arr||[];//undefined在逻辑运算中返回false，若调用时a不存在，则将arr赋予新的空数组[]
80 for(var p in o) arr.push(p);
81 return arr;
82 }
83 getPropertyName(o);
84 getPropertyName(o,myArray);
85
86 设计原则：
87 当使用这种可选参数来创建函数时，满足原则1.可选参数放在参数列表最后。2./**/用注释说明可选参数
88 3.调用函数时，可选参数位置最好显式的传入null作为占位符。
89
90 function foo(arg1,arg2,arg3....){}
91
92 foo(arg1);
93 再回到这个函数调用例子，当实参列表超过形参列表时，函数内部无法显式获得超过部分的引用
94 此时可用arguments类数组来调用，事实上arguments[]数组内存储着传进来的所有实参
95 arguments也包含着length属性；
96
97 实参对象的应用实例：
98 (function (x,y,z){
99 if(arguments.length!=3){
100 throw new Error(
101 "该函数必须传入3个参数"
102 );
103 }
104 console.log(x+y+z);
105 }(1,2));
106 运行结果：Error: 该函数必须传入3个参数
107 用于验证实参列表个数，只有在实参数目为3时，才执行函数。
108 /**
109 复习：类数组对象
110 js的数组有四大特性：
111 1.有新元素加入数组时，自动更新length
112 2.设置length为一个较小值时将截断数组
113 3.从Array.prototype继承一些方法
114 4.其类属性为“Array”
115
116 这四个特性让数组与类数组对象区分开来
117 而像arguments这样的类数组对象，可以理解为其属性名刚好为从0开始的非负整数序列
118 且有个length属性记录它的属性长度
119
120 而区别在于length没有数组的特性1，2.
121 且没有从Array.prototype继承方法
122
123 但是可以利用call临时继承调用
124 var a={"0":"a","1":"b","2":"c"};
125
126 Array.prototype.join.call(a,"+") //"a+b+c"
127
128 Array.map(function(x){return x*x}) //ecma5，不修改原数组，返回一个数组副本，其中的每一项都是
129 参数内函数的返回值。
130
131 */
132 细说实参对象arguments://该对象的可枚举属性仅有实参
133 属性callee与caller
134 callee:指代当前正在执行的函数
135 caller：调用当前正在执行的函数的函数//！--暂时无法理解这句话--！
136
137 callee可用在匿名函数中实现递归
138 function (x) {
139 // body...
140 if(x<1)return 1;
141 return x*arguments.callee(x-1);//此处的arguments.callee()就是在调用函数本身
142 }
143
144 10.将对象属性用作实参，减少记忆参数列表顺序，在参数列表巨大的情况下
145 function arrayCopy(a,a_start,b,b_start,length) {//该函数将a数组从a_start处复制length个元素至b数组中起始位置b_start位置
146 // 要记忆这些形参的顺序实在不容易
147 }
148
149 function easyCopy(argument) {
150 // body...
151 arrayCopy(arguments.from,
152 arguments.from_start||0,
153 arguments.to,
154 arguments.to_start||0,
155 arguments.length
156 )
157 }
158 //在调用easyCopy时，只需传入一个匿名对象就可以了
159 a=[1,2,3,4];
160 b=[];
161 easyCopy(
162 {from:a,to:b,length:4}//传入匿名对象
163 );
164
165 11.作为值的函数
166 在js中，函数也可以作为--实参，传入别的函数参数列表；
167 看如下一个函数的定义
168 function square(x) {return x*x}
169 这个定义创建一个新的函数对象，并将其值赋给square；
170 var s=square;//现在s和square指代同一个函数
171
172 类似数组的sort()方法，接受一个函数
173 写法Array.sort(function (a,b) {return a-b;
174 // body...
175 })
176 或者Array.sort(bj);//bj指代一个函数
177
178 12.自定义函数属性
179 js中函数是对象，所以可以定义函数的属性，用于计数之类的工作
180 比如要计算一个函数的调用次数，又不想定义一个全局变量
181 则可以：
182 foo.times=0;
183 function foo(argument) {
184 // body...
185 foo.times++;
186 }//还有更多用途，
187
188 //定义缓存
189 foo.times=0;//判断if语句执行次数的标记
190 function foo(x){
191 if(x<1&&x!=Math.round(x)) throw new Error("foo（）函数参数为大于1的正整数");
192 if( !(x in foo)){
193 foo.times++;
194 console.log(foo.times);
195 foo[x]=x*foo(x-1);//将已经计算出来的值存储进foo[]类数组之中
196 }
197 return foo[x];
198 }
199 foo[1]=1;
200
201 foo(11);
202 foo(10);//从返回结果可以看到，此处并没进入if判断中，减少了很多次运算
203 foo(12);
204 foo(0.6);//验证数值输入的正确性
205
206 代码运行返回结果：
207 1
208 Html001.html (第 23 行)
209 2
210 Html001.html (第 23 行)
211 3
212 Html001.html (第 23 行)
213 4
214 Html001.html (第 23 行)
215 5
216 Html001.html (第 23 行)
217 6
218 Html001.html (第 23 行)
219 7
220 Html001.html (第 23 行)
221 8
222 Html001.html (第 23 行)
223 9
224 Html001.html (第 23 行)
225 10
226 Html001.html (第 23 行)
227 11
228 Html001.html (第 23 行)
229 Error: foo（）函数参数为大于1的正整数
230
231 13.作为命名空间的函数
232 类似jquery这样的库的做法
233 a.(function (argument) {
234 // body...
235 }())
236 b.(function (argument) {
237 // body...
238 })();
239 定义一个匿名函数并立即调用，在匿名函数内的变量就不会污染全局命名空间
240 对于包裹function的圆括号的解释：
241 function前面没有圆括号时，js会将function解释为函数声明语句，这样就无法立即执行
242 而加上圆括号，或是其他运算符，则会被解释为函数定义表达式。
243
244 14.闭包
245 js中，函数的执行依赖于变量作用域，这个作用域是在函数定义时创建的，而不是在函数执行时。
246 例子1：
247 var scope="global scope";
248 function checkscope() {
249 // body...
250 var scope="local scope";
251 function f() {
252 // body...
253 return scope;
254 }
255 return f();//f在checkscope内部执行时很容易理解，它寻找f的作用域，在checkscope函数内找到scope就返回了
256 }
257 checkscope();
258 例子2：
259 var scope="global scope";
260 function checkscope() {
261 // body...
262 var scope="local scope";
263 function f() {
264 // body...
265 return scope;
266 }
267 return f;
268 }
269 checkscope()(); //在全局执行chechscope内部的函数f；因为闭包的存在，f()也是在其作用域链内寻找scope
270 //这个作用域链在函数定义之初就开始存在
271
272 例子3：
273 foo.times=0;
274 function foo(argument) {
275 // body...
276 foo.times++;
277 }//这是12小结的一个例子，foo.times来记录函数foo的调用次数
278 下面用闭包来改写它。
279 var times=(function () {
280 var count=0;
281 return function(){
282 return count++;
283 }
284 }())//当外层作为命名空间的函数返回之后，除了timer(),任何函数或语句都访问不到其内部的count
285 //而又因为times在外部使用其作用域链上的count，所以count会作为一个变量一直存在内存
286 //times()每次调用都访问的是内存中已经存在的count；故可以充当计数器
287 function foo(argument) {
288 // body...
289 times();
290 }
291
292
293 例子4：
294 function counter(){
295 var count=0;
296 return {
297 count:function(){return ++count;},
298 reset:function(){return count=0;}
299 }//返回一个包含两个方法的匿名对象
300 }
301
302 var obj1=counter();
303 var obj2=counter();//obj1和obj2接受到的是不同的Object。所以他们的count互不干涉
304 console.log(obj1.count());
305 console.log(obj1.count());
306 console.log(obj1.count());
307
308 例子5：//ECMA5中的变体
309 function counter(n){
310 return {
311 get count(){
312 return ++n;
313 },
314 set count(m){
315 if (m<=n) {throw Error("您设置的n太小了")}
316 return n=m;
317 }
318 }
319 }
320 var obj=counter(100);
321 console.log(obj.count);
322 console.log(obj.count);
323 console.log(obj.count);
324 console.log(obj.count=200);
325 console.log(obj.count);
326 console.log(obj.count);
327 利用setter和getter来定义计数器count，给予计数器设置初值和临时更改的方法
328 而count则是obj的私有属性，且通过赋值修改必须遵循get方法设置的条件
329
330 例子6：//闭包实现私有属性的经典做法
331 function addPrivateProperty(o,name,predicate) {
332 // body...
333 var value;
334 o["get"+name]=function () {
335 return value;
336 };
337 o["set"+name]=function(v){
338 if (predicate&&!predicate(v)) {throw new Error("数据未通过predicate函数合法性验证")}
339 value=v;
340 }
341 }
342
343 var o={};
344 addPrivateProperty(o,"Name",function(v){return typeof v=="string";});
345 addPrivateProperty(o,"Age");//未进行合法性验证
346
347 o.setName("wangjue");
348 o.setAge(18);
349 console.log(o.getName());
350 console.log(o.getAge());
351 为何能够不断添加属性，是因为每个属性的set和get方法组--存在于不同的作用域链，
352 可以利用如下例子进行例证：
353 function constfunc(v){
354 var value;
355 return function(){
356 value=v;
357 return value;};
358
359 }
360 var fun1=constfunc("arr1");
361 var fun2=constfunc();//发现只要传递的参数不一样，就会创建新的闭包
362
363 console.log(fun1());//=>arr1
364 console.log(fun2());//=>undefine value并未共享
365
366
367 例子7：
368 function constfunc(v) {
369 // body...
370 return function(){return v;};
371 }//一个总是返回v的函数
372 for(var i=0;i<10;i++) fun[i]=constfunc(i);
373 fun[5]();//=》返回值为5
374
375 上述代码循环创建了很多闭包
376
377 总结性语言：多个嵌套函数并不会将作用域链上的私有成员复制一份，他们是共享的。
378
379 例子8：
380 嵌套函数内，也就是闭包，无法访问外部函数的arguments和this
381 function foo(arg1,arg2) {
382 // body...
383 var self=this;
384 var outArguments=arguments;
385
386 return function () {
387 return self+outArguments.toString(" ");
388 }
389 }
390 前文已经提过，嵌套函数内部使用this，指代的是全局环境window,或者undefined
391 //闭包 end
392
393 15.函数的属性，方法和构造方法
394 在js中，函数是特殊的对象，故其也有对象的一些性质
395 所以其也拥有属性和方法，能够用Function()构造函数创建。
396
397 （1）length：函数对象也拥有一个length属性，其值为函数声明时的形参列表的表长。
398 //一个检测实参与形参是否数量相等的函数
399 function check(argument) {
400 // body...
401 if(argument.length!=argument.callee.length) throw new Error("传入参数数量不对")
402 }
403
404 function test(arg1,arg2) {
405 // body...
406 check(arguments);
407 return arg1+arg2;
408 }
409
410 test(1,2);
411
412 (2)prototype每一个函数都有一个原型属性
413 (3)call(),与aplly()方法
414
415 (4)bind(); //ECMA5中新增的方法，f.bind(obj);将函数f绑定至obj上
416 兼容性解决：
417 function bind(f,o) {
418 // body...
419 if(f.bind) return f.bind(o);
420 else{
421 return f.apply(o,arguments);
422 }
423 }//这里的自定义bind()函数就是将f绑定至o下，且立即执行
424
425 function f(argument) {
426 // body...
427 }
428 f.bind(o,agr1,arg2);//bind除第一个参数外，后面的几个参数都将传入f，参与函数调用
429
430 (5)toString()//返回函数的完整源码
431
432 (6)Function()构造函数；
433
434
435 16.函数式编程
436 类似数组的reduce(),map()之类的方法就是函数式编程的例子
437
438
439 17.高阶函数，所谓高阶函数就是操作函数的函数，其传入函数作为参数，返回值也是函数
440
441 18.记忆函数
442 //闭包的实例
443 function memorize(foo){
444 var cache={};
445 return function () {
446 // body...
447 var key=arguments.length+Array.prototype.join.call(arguments,",");//作为缓存的键
448 if(key in cache) return cache[key];//若在cache中找到了key，则直接返回内存中的值
449 else {
450 cache[key]=foo.apply(this,arguments);//内存中没有，则赋值。
451 return counter[key];//
452 }
453 }
454 }
455
456 //当我们使用一个递归函数时，往往要使用记忆功能
457 var factorial=memorize(function (n) {
458 // body...
459 return n<=1?1:n*factorial(n-1);
460 })
461 factorial(5);
时间： 2024-08-08 11:12:29