javascript学习_0219

1、filter高级函数的使用(使用函数进行过滤)

请尝试用filter()筛选出素数:


‘use strict‘;

function get_primes(arr) {

1 return (arr.filter(function(x){
2         if(x <= 1){ return false;}else{
3         for(var i = 2;i <= x / 2;i++){
4             if(x % i == 0) return false;
5 }
6         return true;
7 }
8 })
9 );//余数为不为0
}

// 测试:
var
    x,
    r,
    arr = [];
for (x = 1; x < 100; x++) {
    arr.push(x);
}
r = get_primes(arr);
if (r.toString() === [2, 3, 5, 7, 11, 13, 17, 19, 23, 29, 31, 37, 41, 43, 47, 53, 59, 61, 67, 71, 73, 79, 83, 89, 97].toString()) {
    alert(‘测试通过!‘);
} else {
    alert(‘测试失败: ‘ + r.toString());
}

2、sort排序函数:通常规定,对于两个元素xy,如果认为x < y,则返回-1,如果认为x == y,则返回0,如果认为x > y,则返回1。

 1 var arr = [10, 20, 1, 2];
 2 arr.sort(function (x, y) {
 3     if (x < y) {
 4         return -1;
 5     }
 6     if (x > y) {
 7         return 1;
 8     }
 9     return 0;
10 }); // [1, 2, 10, 20]
 1 var arr = [‘Google‘, ‘apple‘, ‘Microsoft‘];
 2 arr.sort(function (s1, s2) {
 3     x1 = s1.toUpperCase();
 4     x2 = s2.toUpperCase();
 5     if (x1 < x2) {
 6         return -1;
 7     }
 8     if (x1 > x2) {
 9         return 1;
10     }
11     return 0;
12 }); // [‘apple‘, ‘Google‘, ‘Microsoft‘]

sort()方法会直接对Array进行修改,它返回的结果仍是当前Array

3、闭包

例:

 1 function lazy_sum(arr) {
 2     var sum = function () {
 3         return arr.reduce(function (x, y) {
 4             return x + y;
 5         });
 6     }
 7     return sum;
 8 }
 9
10 var f = lazy_sum([1, 2, 3, 4, 5]); // 返回function sum([1, 2, 3, 4, 5])函数
11
12 f();  // 返回函数值15

在这个例子中,我们在函数lazy_sum中又定义了函数sum,并且,内部函数sum可以引用外部函数lazy_sum的参数和局部变量,当lazy_sum返回函数sum时,相关参数和变量都保存在返回的函数中,这种称为“闭包(Closure)”的程序结构拥有极大的威力。

而要注意的一点是当我们调用lazy_sum()时,每次调用都会返回一个新的函数,即使传入相同的参数,即

1 var f1 = lazy_sum([1, 2, 3, 4, 5]);
2 var f2 = lazy_sum([1, 2, 3, 4, 5]);
3 f1 === f2; // false

f1()和f2()的调用结果互不影响,(意思是两个函数分配到不同的指针上了吧??)

深入理解:

 1 function count() {
 2     var arr = [];
 3     for (var i=1; i<=3; i++) {
 4         arr.push(function () {
 5             return i * i;
 6         });
 7     }
 8     return arr;
 9 }
10
11 var results = count();
12 var f1 = results[0];
13 var f2 = results[1];
14 var f3 = results[2];
15
16 f1(); // 16
17 f2(); // 16
18 f3(); // 16  三个结果相同..

首先,count()函数返回的是一个函数数组,当count函数运行时,它会一直运行,直到产生三个函数元素,“arr[0],arr[1],arr[2]",而此时i的值已经成为4(i++)了,于是当这三个元素函数继续调用时,值都是16。而解决方法是不用或者

 1 function count() {
 2     var arr = [];
 3     for (var i=1; i<=3; i++) {
 4         arr.push((function (n) {
 5             return function () {
 6                 return n * n;
 7             }
 8         })(i));
 9     }
10     return arr;
11 }
12
13 var results = count();
14 var f1 = results[0];
15 var f2 = results[1];
16 var f3 = results[2];
17
18 f1(); // 1
19 f2(); // 4
20 f3(); // 9
21
22 //注意这里用了一个“创建一个匿名函数并立刻执行”的语法:
23 (function (n) {
24             return function () {
25                 return n * n;
26             }
27         })(i)
28
29 (function (x) {
30     return x * x;
31 })(3); // 9

ps:function (x) { return x * x } (3);会报SyntaxError错误,因此需要用括号把整个函数定义括起来

闭包的作用主要体现在模块化的生成,即私有变量,

 1 ‘use strict‘;
 2
 3 function create_counter(initial) {
 4     var x = initial || 0; //当initail不为空时,x = initail,否则为0
 5     return {
 6         inc: function () {
 7             x += 1;
 8             return x;
 9         }
10     }
11 }   //计数器
12
13 var c1 = create_counter(); //c1 => { var x ; inc: function () { x +=1; return x; } }
14 c1.inc(); // 1
15 c1.inc(); // 2
16 c1.inc(); // 3
17
18 var c2 = create_counter(10);
19 c2.inc(); // 11
20 c2.inc(); // 12
21 c2.inc(); // 13

在返回的对象中,实现了一个闭包,该闭包携带了局部变量x,并且,从外部代码根本无法访问到变量x。换句话说,闭包就是携带状态的函数,并且它的状态可以完全对外隐藏起来。

闭包还可以把多参数的函数变成单参数的函数。例如,要计算xy可以用Math.pow(x, y)函数,不过考虑到经常计算x2或x3,我们可以利用闭包创建新的函数pow2pow3

 1 function make_pow(n) {
 2     return function (x) {
 3         return Math.pow(x, n);
 4     }
 5 }
 6
 7 // 创建两个新函数:
 8 var pow2 = make_pow(2); //相当于pow2=>function(x){ return Math.pow(x,2); }
 9 var pow3 = make_pow(3); //相当于pow3=>function(x){ return Math.pow(x,3); }10  11 pow2(5); // 25 12 pow3(7); // 343

理解下面代码

 1 ‘use strict‘;
 2
 3 // 定义数字0:
 4 var zero = function (f) {
 5     return function (x) {
 6         return x;
 7     }
 8 };
 9
10 // 定义数字1:
11 var one = function (f) {
12     return function (x) {
13         return f(x);
14     }
15 };
16
17 // 定义加法:
18 function add(n, m) {
19     return function (f) {
20         return function (x) {
21             return m(f)(n(f)(x));
22         }
23     }
24 }
25
26 // 计算数字2 = 1 + 1:
27 var two = add(one, one);
28
29 // 计算数字3 = 1 + 2:
30 var three = add(one, two);
31
32 // 计算数字5 = 2 + 3:
33 var five = add(two, three);
34
35 // 你说它是3就是3,你说它是5就是5,你怎么证明?
36
37 // 呵呵,看这里:
38
39 // 给3传一个函数,会打印3次:
40 (three(function () {
41     console.log(‘print 3 times‘);
42 }))();
43
44 // 给5传一个函数,会打印5次:
45 (five(function () {
46     console.log(‘print 5 times‘);
47 }))();
时间: 2024-10-15 00:55:54

javascript学习_0219的相关文章

javascript学习

javascript 学习 title: Javascripttags: javascript,学习grammar_cjkRuby: true--- 定义变量 三种形式 var name; var name = "zhang san"; var name; name = "zhang san"; Javascript 的数据类型 6种数据类型 字符串单引号或双引号 var name = "zhang san"; var name = 'zhang

Javascript 学习笔记 2: 标识语句

可以在任何语句声明之前使用唯一标识(identifier)和冒号(:)用来标记该语句: identifier: statement 这样,你可以在程序的任何其他地方通过标识来使用这个语句.即使在语句内部也可以使用该语句的标识(例如:循环语句和条件语句).当在一个循环语句前添加一个标识,你可以在语句内部通过break 标识来退出当前循环,也可以通过continue标识来继续执行该语句.例如: mainloop: while(token != null) { // Code omitted... c

JavaScript学习之DIV层与图像

DIV层与图像 一.设计一个可定位的层 1.设置位置(position)和大小 (1)绝对定位(absolute):以页面边框为参照,只要设置好绝对位置,那么元素的位置会始终固定在距离边框某个位置的距离. 绝对定位有两个属性:left和top,分别是距离网页左边和网页顶部的绝对位置,可借助style属性直接设置: style="position:absolute;left:距离左边距离;top:距离顶部距离" (2)相对定位(relative):需要有一个参照元素,设置好相对位置和参照

JavaScript学习05 定时器

JavaScript学习05 定时器 定时器1 用以指定在一段特定的时间后执行某段程序. setTimeout(): 格式:[定时器对象名=] setTimeout(“<表达式>”,毫秒) 功能:执行<表达式>一次. 例子: <!DOCTYPE html> <html> <head> <title>timer1.html</title> <meta http-equiv="keywords" co

Javascript学习--------认识window窗口对象

window对象: Window 对象表示浏览器中打开的窗口. 可以通过window对象设置窗口的大小,位置等. 还可以控制是否加载网页等. window对象集合: 集合 描述 frames[] 返回窗口中所有命名的框架. 该集合是 Window 对象的数组,每个 Window 对象在窗口中含有一个框架或 <iframe>.属性 frames.length 存放数组 frames[] 中含有的元素个数.注意,frames[] 数组中引用的框架可能还包括框架,它们自己也具有 frames[] 数

Javascript学习------FileSystemObjec对象

动态创建FileSystemObject对象: var fso=new FileSystemObject("Scripting.FileSystemObject"); (接下来可以用变量fso对Drive对象.Drives集合.File对象.Files集合.Folder对象.Folders集合以及TextStream对象进行相应的操作.) FileSystemObject对象的方法 ·GetAbsolutePathName()方法:该方法根据提供的路径返回完整的路径. ·GetBase

javascript学习笔记---ECMAScript-判断变量类型

判断类型之前,先要清楚有哪些类型. (理理思路:程序由数据和方法构成,数据由简单数据和复杂数据构成) 即类型有: 数据(简单数据:boolean,string,num,undefined,null.复杂数据:object), 方法(function) 万能的typeof,神一样的方法 typeof(1);// num typeof("hello");// string   typeof(false);// boolean var vFlag; typeof(vFlag);// unde

HTMl5/CSS3/Javascript 学习推荐资源

HTMl5/CSS3/Javascript 学习推荐资源 前端的定义应该是数据内容的展示,在国内大家都觉得前端只是HTML+CSS+Javascript,但是实际上与展示有关的都是前端,所以Ruby/Python/Nodejs/Java/ASP .NET只要和展示有关的部分都可以称之为前端.在这里由于篇幅的限制,我们只推荐与HTML+CSS+Javascript三者有关的前端技术 入门 w3school html5 简单HTML5的入门教程 w3school css3 简单的CSS3入门教程 J

javascript学习4-练习之1转置矩阵

1.做了个小小练习,对矩阵进行转置和对不规则的二维数组进行行列互换(不规则二维数组不存在有转置矩阵一说).用以加深对二维数组的理解. 2.效果图如下: 3.两种方式的代码分别如下: 3.1规则矩阵转置: 1 //规则转置 2 var array2=[[1,2,3],[4,5,6]]; 3 var array22=new Array(); 4 array22[0]=new Array(2); 5 array22[1]=new Array(2); 6 array22[2]=new Array(2);