JavaScript自学笔记(必看篇)

 if(x){} //变量被初始化了或者变量不为空或者变量不为零 

 function sum(i1,i2){return i1+i2} 

 var f=function(i1,i2){return i1+i2;}; alert(f(1,2));//普通匿名函数 alert(function(i1,i2){return i1+i2;}(3,4));//直接声明,立即使用 

 function Person(name,age){ this.Name=name;//动态增加属性，类似于C#里的dynamic A = new ExpendoObject(); this.Age=age; this.SayHello=function(){alert('Hello,My name is '+name+' I am '+age+' years old.')}; } var p1=new Person('lorry',21); p1.SayHello(); //像类一样调用 p1.Gender='男';    //动态增加‘性别'属性 alert(p1.Gender);

 var arr=new Array(); arr[0]=0; arr[1]=1; arr[2]=2; for(var i=0;i<=arr.length-1;i++){ alert(arr[i]); } 

 var dict=new Array();//作为Dictionary使用 dict['我']='wo'; dict['爱']='ai'; dict['你']='ni'; alert(dict['我']); //通过键值调用 alert(dict.爱); //像调用属性一样调用（动态语言的特性） for(var k in dict){ //js中的遍历 alert(k);  //'我'，'爱'，'你'-->打印出的是key } for(var k of dict){ //js中的遍历 alert(k);  //'wo'，'ai'，'ni'-->打印出的是value } var arr = [1,2,3,4,5];//Array的简化创建方式 var arr = {"lorry":21,"cloud":20};//字典风格的创建方式 

 var s=null; for(var k in document){//对象的属性都是以key的形式出现的 s+=k+" ;"; } alert(s);

 var s = 'Hello, world!'; s[0]; // 'H' s[6]; // ' ' s[12];    // '!' s[13];    // undefined 超出范围的索引不会报错，但一律返回undefined 需要特别注意的是，字符串是不可变的，如果对字符串的某个索引赋值，不会有任何错误，但是，也没有任何效果： var s = 'Test'; s[0] = 'X'; alert(s);  // s仍然为'Test'

 var s = 'Hello'; s.toUpperCase();  // 返回'HELLO' var s = 'Hello'; s.toLowerCase();  // 返回'hello'

 var s = 'hello, world'; s.indexOf('world'); // 返回7 s.indexOf('World'); // 没有找到指定的子串，返回-1 

 var s = 'hello, world' s.substring(0, 5);  // 从索引0开始到5（不包括5），返回'hello' s.substring(7);// 从索引7开始到结束，返回'world' 

 var xiaoming = { name: '小明', birth: 1990, school: 'No.1 Middle School', height: 1.70, weight: 65, score: null//最后一个键值对不需要在末尾加',' }; xiaoming.name;   // '小明' xiaoming.birth;    // 1990 访问属性是通过.操作符完成的，但这要求属性名必须是一个有效的变量名。如果属性名包含特殊字符，就必须用[]括起来： var xiaohong = { name: '小红', 'middle-school': 'No.1 Middle School' }; xiaohong['middle-school'];   // 'No.1 Middle School' xiaohong['name'];  // '小红' xiaohong.name;    // '小红' xiaohong.age; // undefined

 'name' in xiaoming;// true 'grade' in xiaoming;// false ***如果in判断一个属性存在，这个属性不一定是xiaoming的，它可能是xiaoming继承得到的： 'toString' in xiaoming;   // true ***要判断一个属性是否是xiaoming自身拥有的，而不是继承得到的，可以用hasOwnProperty()方法： xiaoming.hasOwnProperty('name');    // true xiaoming.hasOwnProperty('toString'); // false

 var m = new Map([['Michael', 95], ['Bob', 75], ['Tracy', 85]]);//二维数组初始化法 m.get('Michael'); // 95 var m = new Map();// 直接初始化一个空Map m.set('Adam', 67); // 添加新的key-value m.set('Bob', 59); m.has('Adam');    // 是否存在key 'Adam': true m.get('Adam');    // 67 m.delete('Adam'); // 删除key 'Adam' m.get('Adam');    // undefined var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]); for (var n of m) {   // 遍历Map alert(n[1] + '=' + n[0]); } 

 var a = ['A', 'B', 'C']; a.forEach(function (element, index, array) { // element: 指向当前元素的值 // index: 指向当前索引 // array: 指向Array对象本身 alert(element); }); Set与Array类似，但Set没有索引，因此回调函数最多两个参数： var s = new Set(['A', 'B', 'C']); s.forEach(function (element, set) { alert(element); }); Map的回调函数参数依次为value、key和map本身： var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]); m.forEach(function (value, key, map) { alert(value); }); var a = ['A', 'B', 'C']; a.forEach(function (element) { alert(element); }); 

 var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; arr.map(function(x){ return x*x; }).forEach(function (element) { alert(element);// [1, 4, 9, 16, 25, 36, 49, 64, 81] });

 var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; arr.map(String); // ['1', '2', '3', '4', '5', '6', '7', '8', '9'] 

 var arr = []; for (var x = 1; x <= 100; x++) { arr.push(x); //将1~100放入数组 } alert(arr.reduce(function(x,y){ return x+y;   //对arr的所有对象累积求和，返回求和结果 }));

 var arr = [1, 2, 5, 8, 0]; alert(arr.reduce(function(x,y){ return x*10+y; }));

 var arr = [0,1,2,3,4,5,6,7,8,9]; alert(arr.filter(function(x){ return x%2===0; }));//0,2,4,6,8 //返回true则保留 把一个Array中的空字符串删掉 var arr = ['A', '', 'B', null, undefined, 'C', ' ']; alert(arr.filter(function (s) { return s && s.trim(); // 注意：IE9以下的版本没有trim()方法 })); // ['A', 'B', 'C']

 [10, 20, 1, 2].sort(); // [1, 10, 2, 20] 因此如果要按数字大小排序，可以这么写： var arr = []; for (var x = 1; x <= 10; x++) { arr.push(x); } document.write(arr+"
"); document.write(arr.sort(function(x,y){ return x

 ①将函数作为返回值赋值给参数，调用该参数获得计算结果 var arr = []; for(var n=1;n<101;n++){ arr.push(n); } function lazy_sum(arr){ var sum = function(){ return arr.reduce(function(x,y){ return x+y; }); } return sum; } var f = lazy_sum(arr); alert(f()); ②返回的函数并没有立刻执行，而是直到调用了f()才执行 function count() { var arr = []; for (var i=1; i<=3; i++) { arr.push(function () { return i * i; }); } return arr; } var results = count(); //results里存了3个function var f1 = results[0]; var f2 = results[1]; var f3 = results[2]; f1(); // 16 返回的函数引用了变量i，但它并非立刻执行。 f2(); // 16 等到3个函数都返回时，它们所引用的变量i已经变成了4， f3(); // 16 因此最终结果为16 ***返回闭包时牢记：返回函数不要引用任何循环变量，或者后续会发生变化的变量! ③如果一定要引用循环变量怎么办？ 方法是再创建一个函数，用该函数的参数绑定循环变量当前的值， 无论该循环变量后续如何更改，已绑定到函数参数的值不变： function count() { var arr = []; for (var i=1; i<=3; i++) { arr.push(function(n){ return function(){ return n*n; } }(i)); } return arr; } var results = count(); var f1 = results[0]; var f2 = results[1]; var f3 = results[2]; alert(f1()); // 1 alert(f2()); // 4 alert(f3()); // 9 ④在没有class机制，只有函数的语言里，借助闭包，可以封装一个私有变量 function creat_counter(init){ var n = init||0; return{ add:function(){ n+=1; return n; } } } var c = creat_counter(); alert(c.add());//1 alert(c.add());//2 alert(c.add());//3 ***在返回的对象中，实现了一个闭包，该闭包携带了局部变量n，并且，从外部代码根本无法访问到变量n。 换句话说，闭包就是携带状态的函数，并且它的状态可以完全对外隐藏起来。 ⑤利用Math.pow(x, y)计算x^2或x^3 //Math.pow(x, y)-->x^y function make_pow(y){ return function(x){ return Math.pow(x,y); } } var pow2 = make_pow(2) var pow3 = make_pow(3) alert(pow2(3))//9 alert(pow3(3))//27

 var f = x => x*x*x alert(f(3)) //27 

 function* fib(max){ var t,a=0,b=1,n=1; while(n<=max){ yield a; t=a+b; a = b; b = t; n++; } return a; } for (var x of fib(10)) {//用for ... of循环迭代generator对象 document.write(x+' '); // 依次输出0, 1, 1, 2, 3 } 用generator产生一个自增的ID(无需全局变量) function* next_id(){ for(var x = 1; x <100; yield x++ ); } var g = next_id(); alert(g.next().value);//1 alert(g.next().value);//2 alert(g.next().value);//3