JavaScript自学笔记(必看篇)
0-判断变量、参数是否初始化
if(x){}//变量被初始化了或者变量不为空或者变量不为零
1-声明函数不需要声明返回值、参数类型,句尾甚至都不需要';'
functionsum(i1,i2){returni1+i2}
2-直接声明匿名函数立即使用
varf=function(i1,i2){returni1+i2;};alert(f(1,2));//普通匿名函数
alert(function(i1,i2){returni1+i2;}(3,4));//直接声明,立即使用
3-js中没有类的概念,于是有些方法就长的像类了
functionPerson(name,age){
this.Name=name;//动态增加属性,类似于C#里的dynamicA=newExpendoObject();
this.Age=age;
this.SayHello=function(){alert('Hello,Mynameis'+name+'Iam'+age+'yearsold.')};
}
varp1=newPerson('lorry',21);
p1.SayHello();//像类一样调用
p1.Gender='男';//动态增加‘性别'属性
alert(p1.Gender);
4-Array对象就是数组,定义数组不用预先限定长度
vararr=newArray();
arr[0]=0;
arr[1]=1;
arr[2]=2;
for(vari=0;i<=arr.length-1;i++){
alert(arr[i]);
}
5-Array是数组,也是Dictionary,也是Stack
vardict=newArray();//作为Dictionary使用
dict['我']='wo';
dict['爱']='ai';
dict['你']='ni';
alert(dict['我']);//通过键值调用
alert(dict.爱);//像调用属性一样调用(动态语言的特性)
for(varkindict){//js中的遍历
alert(k);//'我','爱','你'-->打印出的是key
}
for(varkofdict){//js中的遍历
alert(k);//'wo','ai','ni'-->打印出的是value
}
vararr=[1,2,3,4,5];//Array的简化创建方式
vararr={"lorry":21,"cloud":20};//字典风格的创建方式
6-遍历当前页面能够调用的所有元素
vars=null;
for(varkindocument){//对象的属性都是以key的形式出现的
s+=k+";";
}
alert(s);
7-使用类似Array的下标操作获取字符串某个指定位置的字符
vars='Hello,world!'; s[0];//'H' s[6];//'' s[12];//'!' s[13];//undefined超出范围的索引不会报错,但一律返回undefined 需要特别注意的是,字符串是不可变的,如果对字符串的某个索引赋值,不会有任何错误,但是,也没有任何效果: vars='Test'; s[0]='X'; alert(s);//s仍然为'Test'
8-改大写小写
vars='Hello'; s.toUpperCase();//返回'HELLO' vars='Hello'; s.toLowerCase();//返回'hello'
9-搜索指定字符串出现的位置
vars='hello,world';
s.indexOf('world');//返回7
s.indexOf('World');//没有找到指定的子串,返回-1
10-获取字符串指定索引区间的子串
vars='hello,world' s.substring(0,5);//从索引0开始到5(不包括5),返回'hello' s.substring(7);//从索引7开始到结束,返回'world'
11-JavaScript的对象是一种无序的集合数据类型,它由若干键值对组成
varxiaoming={
name:'小明',
birth:1990,
school:'No.1MiddleSchool',
height:1.70,
weight:65,
score:null//最后一个键值对不需要在末尾加','
};
xiaoming.name;//'小明'
xiaoming.birth;//1990
访问属性是通过.操作符完成的,但这要求属性名必须是一个有效的变量名。如果属性名包含特殊字符,就必须用[]括起来:
varxiaohong={
name:'小红',
'middle-school':'No.1MiddleSchool'
};
xiaohong['middle-school'];//'No.1MiddleSchool'
xiaohong['name'];//'小红'
xiaohong.name;//'小红'
xiaohong.age;//undefined
12-检测xiaoming是否拥有某一属性,用in操作符:
'name'inxiaoming;//true
'grade'inxiaoming;//false
***如果in判断一个属性存在,这个属性不一定是xiaoming的,它可能是xiaoming继承得到的:
'toString'inxiaoming;//true
***要判断一个属性是否是xiaoming自身拥有的,而不是继承得到的,可以用hasOwnProperty()方法:
xiaoming.hasOwnProperty('name');//true
xiaoming.hasOwnProperty('toString');//false
13-Map
varm=newMap([['Michael',95],['Bob',75],['Tracy',85]]);//二维数组初始化法
m.get('Michael');//95
varm=newMap();//直接初始化一个空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
varm=newMap([[1,'x'],[2,'y'],[3,'z']]);
for(varnofm){//遍历Map
alert(n[1]+'='+n[0]);
}
14-iterable内置的forEach方法,它接收一个函数,每次迭代就自动回调该函数。
vara=['A','B','C'];
a.forEach(function(element,index,array){
//element:指向当前元素的值
//index:指向当前索引
//array:指向Array对象本身
alert(element);
});
Set与Array类似,但Set没有索引,因此回调函数最多两个参数:
vars=newSet(['A','B','C']);
s.forEach(function(element,set){
alert(element);
});
Map的回调函数参数依次为value、key和map本身:
varm=newMap([[1,'x'],[2,'y'],[3,'z']]);
m.forEach(function(value,key,map){
alert(value);
});
vara=['A','B','C'];
a.forEach(function(element){
alert(element);
});
15-用Array的map()方法,传入我们自己的函数,就得到了一个新的Array作为结果:
vararr=[1,2,3,4,5,6,7,8,9];
arr.map(function(x){
returnx*x;
}).forEach(function(element){
alert(element);//[1,4,9,16,25,36,49,64,81]
});
16-用map()把Array的所有数字转为字符串:
vararr=[1,2,3,4,5,6,7,8,9]; arr.map(String);//['1','2','3','4','5','6','7','8','9']
17-用Array的reduce()做累积计算
vararr=[];
for(varx=1;x<=100;x++){
arr.push(x);//将1~100放入数组
}
alert(arr.reduce(function(x,y){
returnx+y;//对arr的所有对象累积求和,返回求和结果
}));
18-用reduce()做一个牛逼的转换:把[1,2,5,8,0]变换成整数12580
vararr=[1,2,5,8,0];
alert(arr.reduce(function(x,y){
returnx*10+y;
}));
19-用filter()把Array的某些元素过滤掉
vararr=[0,1,2,3,4,5,6,7,8,9];
alert(arr.filter(function(x){
returnx%2===0;
}));//0,2,4,6,8//返回true则保留
把一个Array中的空字符串删掉
vararr=['A','','B',null,undefined,'C',''];
alert(arr.filter(function(s){
returns&&s.trim();//注意:IE9以下的版本没有trim()方法
}));//['A','B','C']
20-Array的sort()方法默认把所有元素先转换为String再排序,于是...
[10,20,1,2].sort();//[1,10,2,20]
因此如果要按数字大小排序,可以这么写:
vararr=[];
for(varx=1;x<=10;x++){
arr.push(x);
}
document.write(arr+"<br/>");
document.write(arr.sort(function(x,y){
returnx<y?true:false;
}));
若要忽略字母大小写影响,则要先转化为大写或小写
vararr=['Google','apple','Microsoft'];
alert(arr.sort(function(s1,s2){
varx1=s1.toUpperCase();
varx2=s2.toUpperCase();
returnx1<x2?false:true;
}));//['apple','Google','Microsoft']
21-闭包(Closure)程序结构
①将函数作为返回值赋值给参数,调用该参数获得计算结果
vararr=[];
for(varn=1;n<101;n++){
arr.push(n);
}
functionlazy_sum(arr){
varsum=function(){
returnarr.reduce(function(x,y){
returnx+y;
});
}
returnsum;
}
varf=lazy_sum(arr);
alert(f());
②返回的函数并没有立刻执行,而是直到调用了f()才执行
functioncount(){
vararr=[];
for(vari=1;i<=3;i++){
arr.push(function(){
returni*i;
});
}
returnarr;
}
varresults=count();//results里存了3个function
varf1=results[0];
varf2=results[1];
varf3=results[2];
f1();//16返回的函数引用了变量i,但它并非立刻执行。
f2();//16等到3个函数都返回时,它们所引用的变量i已经变成了4,
f3();//16因此最终结果为16
***返回闭包时牢记:返回函数不要引用任何循环变量,或者后续会发生变化的变量!
③如果一定要引用循环变量怎么办?
方法是再创建一个函数,用该函数的参数绑定循环变量当前的值,
无论该循环变量后续如何更改,已绑定到函数参数的值不变:
functioncount(){
vararr=[];
for(vari=1;i<=3;i++){
arr.push(function(n){
returnfunction(){
returnn*n;
}
}(i));
}
returnarr;
}
varresults=count();
varf1=results[0];
varf2=results[1];
varf3=results[2];
alert(f1());//1
alert(f2());//4
alert(f3());//9
④在没有class机制,只有函数的语言里,借助闭包,可以封装一个私有变量
functioncreat_counter(init){
varn=init||0;
return{
add:function(){
n+=1;
returnn;
}
}
}
varc=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
functionmake_pow(y){
returnfunction(x){
returnMath.pow(x,y);
}
}
varpow2=make_pow(2)
varpow3=make_pow(3)
alert(pow2(3))//9
alert(pow3(3))//27
22-箭头函数(目前仅firefox支持)//参数=>函数体
varf=x=>x*x*x alert(f(3))//27
23-用generator产生斐波那契数列
function*fib(max){
vart,a=0,b=1,n=1;
while(n<=max){
yielda;
t=a+b;
a=b;
b=t;
n++;
}
returna;
}
for(varxoffib(10)){//用for...of循环迭代generator对象
document.write(x+' ');//依次输出0,1,1,2,3
}
用generator产生一个自增的ID(无需全局变量)
function*next_id(){
for(varx=1;x<100;yieldx++);
}
varg=next_id();
alert(g.next().value);//1
alert(g.next().value);//2
alert(g.next().value);//3
以上就是小编为大家带来的JavaScript自学笔记(必看篇)全部内容了,希望大家多多支持毛票票~