（一）函数
1.函数基本声明
function fun([参数1],[参数2],...){
函数体；
};
2.函数表达式，又叫函数字面量
var 变量=function([参数1],[参数2],...){
函数体；
};
3.函数构造法，需要new关键字词
var 变量=new function("参数1","参数2",...,函数体);
（二）对象、属性、数组等
1.
var o={
init:function(){
this.bind();
this.popup();
},
bind:function(){
return "你好";
},
popup:function(){
}
};
//调用
o.init();
2.
var obj={};
obj.name="yaoyao";
obj['age']=23;
console.log(obj['name']);
console.log(obj['age']);
运行结果：yaoyao
23
ps:obj['name']等同于obj.name;两者区别：其中.是取自身属性，[]的里面可以是变量
3.
var obj={};
obj.name="yaoyao";
var nameN='name';
console.log(obj.nameN);
console.log(obj.['nameN']);
console.log(obj.[nameN]);//obj.[nameN]==obj.'name'
运行结果： undefined
undefined
yaoyao
4.删除属性；delete
//创建对象
var obj={};
obj.name="yaoyao";
//删除属性
delete obj.name;
console.log(obj['name']);
运行结果：undefined
5.检测属性:in\hasOwnProperty
//创建对象
var obj={};
obj.name="yaoyao";
obj.age="undefined";
console.log(name in o);//检测属性是否属于当前对象，运算符in
console.log(obj.hasOwnProperty('name'));//检测属性,运算符hasOwnProperty
console.log(obj.name!=undefined);//检测属性
console.log(obj.age!=undefined);
运行结果： true
true
true
false
6.对象遍历、枚举属性
var o={//对象
x:1,
y:2,
z:3
};
//数组对象
var arr=[{x:1},{y:2},{z:3}];
for(a in o){ //a是变量，for in遍历出key
console.log(a);
}
for(a in o){ //a是变量，for in遍历出value
console.log(o[a]);
}
for(a in arr){ //a是变量，for in遍历出数组的索引
console.log(a);
}
运行结果： x
y
z
1
2
3
0
1
2
7.数组循环
var arr=new Array();
arr=[1.6,5,3,5,33];
for(var i=0;i
}
$.each(arr,function(index,item){//方法二,异步
})
8.序列化对象
ps: 深拷贝和浅拷贝的区别：深拷贝--类似双胞胎是两个独立的个体；浅拷贝--也就是引用，类似人和自己的影子对象数组都是浅拷贝。
ps: 数据交互的数据类型是json\xml字符串等，不能是对象，所以要想传送对象给服务器，需要序列化对象
var o={//对象
x:1,
y:2,
z:3
};
console.log(JSON.stringify(o));//对象转换成字符串--stringify
console.log(typeof(JSON.stringify(o));//检测数据类型
var str=JSON.stringify(o);//把字符串转换成对象--parse
console.log(typeof(JSON.parse(str));//JSON.parse(str)是深拷贝，类似双胞胎是两个独立的个体 （浅拷贝，也就是引用，类似人和自己的影子）
var 02={
x:1,
y:2,
z:3
}
var p=02;
o2.x='111';//浅拷贝--引用，随之改变
console.log(p);
运行结果：
{"x":1,"y":2,"z":3}
string
object
{x:"111",y:2,z:3}
9.jq的ajax实例
$().ready(function () {
$('#Login').click(function () {
if ($('#username').val() == "" || $('#password').val() == "") {
alert("用户名或密码不能为空！");
}
else {
$.ajax({
type: "POST",
url: "Ajax/LoginHandler.ashx",
data: "username=" + escape($('#username').val()) + "&password=" + escape($('#password').val()),
beforeSend: function () {
$("#loading").css("display", "block"); //点击登录后显示loading，隐藏输入框
$("#login").css("display", "none");
},
success: function (msg) {
$("#loading").hide(); //隐藏loading
if (msg == "success") {
//parent.tb_remove();
parent.document.location.href = "admin.htm"; //如果登录成功则跳到管理界面
parent.tb_remove();
}
if (msg == "fail") {
alert("登录失败！");
}
},
complete: function (data) {
$("#loading").css("display", "none"); //点击登录后显示loading，隐藏输入框
$("#login").css("display", "block");
},
error: function (XMLHttpRequest, textStatus, thrownError) {
}
});
}
});
});
10.判断arr数组对象里面是否有a---hasOwnProperty()
var arr=[{a:1,q:2,w:3},{d:1,r:2,c:3},{t:1,v:2,z:3}];
for(var i=0;i
if(arr[i].hasOwnProperty('a')){//hasOwnProperty检测arr里main是否存在a
console.log('yes');
break;//跳出当前循环
}else{
console.log('no');
}
}
$.each(arr.function(index,item){//此时的item是对象
if(item.hasOwnProperty('a')){
console.log('yes');
}else{
console.log('no');
}
})
$.each(arr.function(index,item){//index是索引，此时的item是对象
if(item.a!=undefined){
console.log('yes');
}else{
console.log('no');
}
})
运行结果： yes
yes
yes
(三)
1.原型--prototype（原型属性）
ps: 每个函数都有一个原型属性，在此原型属性中都有一个构造（constructor）函数，原型里面所共有的属性对象实例化也有。
function Person(){
};
Person.prototype.name='yaoyao';
Person.prototype.age=22;
Person.prototype.action=function(){
console.log(this.name);//该this指当前实例化的对象，并不是原型
};
var person1=new Person();
person1.name='ben';//局部改变
var person2=new Person();
console.log(person2.age);//输出22
person1.__proto__.age=30;//通过__proto__改变age属性值，全局发生了变化，全局age就等于30
console.log(person1.name);//输出ben
console.log(person2.name);//输出yaoyao
console.log(person2.age);//输出30
console.log(person2);//输出：Person {}
__proto__:
action:?()
age:30
name:"liangxue"
constructor:? Person()
__proto__:Object
console.log(Person.prototype.isPrototypeOf(person2));//输出true--检测当前实例person2是否属于该原型
2.构造函数和原型混合使用
（1）单纯使用构造函数时（当需要多个实例时就得new多个，会导致性能变差，内存溢出，所以需要使用原型）
//构造函数
function Aa(name,age){
this.name=name;
this.age=age;
this.action=function(){
return this.name;
}
};
var aa=new Aa('yaoyao',24);
var bb=new Aa('sushan',24);
console.log(aa.name);//输出yaoyao
（2）结合原型使用
//构造函数
function Aa(name,age,hobby){
this.name=name;
this.age=age;
this.hobby=hobby;
};
//原型--不会因为实例化多个而变化
Aa.prototype.action=function(){
return '名字：'+this.name+',年龄：'+this.age+',爱好：'+this.hobby;
};
var aa=new Aa('yaoyao',24,'唱歌');
var bb=new Aa('sushan',24,'跳舞');
console.log(bb.action());//输出--名字：sushan,年龄：24,爱好：跳舞
3.继承（先继承代沟最小的，依次往后）
（1）
function Anima(){}
Anima.prototype.canDo=function(){
console.log("吃饭睡觉");
}
function Cat(){}
Cat.prototype=new Anima();//Cat继承Anima
var cat=new Cat();//cat不仅拥有Anima里面的也拥有Cat里面的。
cat.canDo();//输出：吃饭睡觉
function Dog(){
this.canDo=function(){
console.log("吃狗粮");
}
}
Dog.prototype=new Anima();//Dog继承Anima
var dog=new Dog();
dog.canDo();//输出：吃狗粮
cat1.canDo=function(){
console.log("猫吃鱼");
};
cat1.canDo();//输出：猫吃鱼
（2）
function Fa(){}
Fa.prototype.name="fa";
Fa.prototype.age=23;
function Fb(){};
Fb.prototype=new Fa();
Fb.prototype.name="fb";
Fb.prototype.age=24;
function Fc(){};
Fc.prototype=new Fb();
Fc.prototype.name="fc";
var fc=new Fc();
console.log(fc.name);//输出fc
fc.__proto__.name="fcc";//当前有name，改变当前
console.log(fc.name);//输出fcc
console.log(fc.age);//输出24，改变前
fc.__proto__.age=25;//当前没有age，改变有age且代沟最小的父类Fb
console.log(fc.age);//输出25
var fa=new Fa();
console.log(fa.age);//输出23，未被改变
4.有参数时的构造函数、原型、继承
function ParentType(name,age){
this.name=name;
this.age=age;
};
ParentType.prototype.getParentName=function(){
return this.name;
}
function SonType(){
ParentType.call(this,"yaoyao",23);//子类调用父类并传参，也可以使用apply(),作用都是在一个对象中调用另一个对象，区别在于所传参数call(this,name,age) apply(this,数组)。
this.name='yy';
};
SonType.prototype=new ParentType();
SonType.prototype.getSonName=function(){
return this.name;
};
var aa=new SonType();
console.log(aa.name);//输出yy，如果实例化里有name先取实例化的
console.log(aa.age);//输出23
（四）作用域、闭包、递归、this关键字
1.作用域---当前所在区域，大可分为全局作用域、局部作用域
var x="123";
function aa(){
var a='1';
}
function bb(){
var b='2';
console.log(b);//局部
console.log(x); //全局
}
bb();//输出2
123
2.闭包--内部和外部的函数联系桥梁
（1）
var x="s1";
function aa(){
var x="s2";
function son(){
var x="s3";
return x;
};
return son();
};
console.log(aa());//输出：s3
（2）
var x="s1";
function aa(){
var x="s2";
return function son(){
var x="s3";
return x;
};
};
console.log(aa());//输出： ? son(){
var x="s3";
return x;
}
console.log(aa()());//输出：s3
（3）
var fun=(function aa(){
var x="s2";
return function son(){
var x="s3";
return x;
};
}());
console.log(fun());//输出s3
3.递归
（1）
function setup(x){
var i=0;
return function(){
return x[i++];
}
}
var next=setup(['a','b','c']);
console.log(next());//输出a
console.log(next());//输出b
console.log(next());//输出c
（2）
var fun= (function setup(x){
var i=0;
return function(){
return x[i++];
}
}(['a','b','c']));
console.log(fun());//输出a
console.log(fun());//输出b
console.log(fun());//输出c
4.this关键字---指当前调用函数的对象（函数的拥有者）
（1）函数中引用
var x=1;
function test(){
this.x;//指向window.x
};
test();
console.log(x);//输出1
-----------------
var x=1;
function test(){
this.x=0;//指向window.x
};
test();
console.log(x);//输出0
-----------------
var x=1;
function test(){
this.x=0;//指向window.x
};
function test1(){
this.x=1;//指向window.x
};
test();
test1();
console.log(x);//输出1,根据执行顺序
（2）对象中调用
var o={};//创建对象
o.a=1;
o.action=function(){
return this.a;//this指向o对象
}
console.log(o.action());//输出1
--------------------
对象中调用外部函数
function test(){
return this.a;//this指向o对象
}
var o={};//创建对象
o.a=1;
o.action=test;
console.log(o.action());//输出1
--------------------
ps: 改变this指向，可以用call(),appy()，用于在当前对象中调用其他对象，两者区别在于传参不同，appy(this,[])传的是数组；call(this,age,name);
var a="111";
function test(){
return this.a;//this指向o对象
}
var o={};//创建对象
o.a=1;
o.b=test;
console.log(o.b.call());//输出111，call()未传参，此时this指向window中的a
console.log(o.b.call(o));//输出1，call()传o对象，此时this指向o中的a
（3）构造函数调用
function Fun(name,age){
this.name=name;
this.age=age;
}
var fun=new Fun("yaoyao",24);
console.log(fun.name);//输出yaoyao
（4）this指向----面试题
ps: 函数自执行 this指向window
var a=1;
var o={
a:2,
showA:function(){
this.a=3;
(function(){//闭包，自调
console.log(this.a);//指向window中的a,输出1
})();
console.log(this.a);//指向当前对象的a,输出3
}
}
o.showA();
网友评论