2019-06-13

单体创建对象

var Tom = {

// 属性

name:'tom',

age:18,

// 方法

showName:function(){

alert(

this.name);

},

showAge:function(){

alert(this.age);

}

}

//调用属性

alert(

Tom.name);

alert(Tom.age);

//调用方法

Tom.showName();

工厂模式创建对象

function Person(name,age,job){

//创建一个空对象

// var o = new Object();//方式一

var o = {};//方式二

o.name = name;

o.age = age;

o.job = job;

o.showName = function(){

alert(

this.name);

}

o.showAge = function(){

alert(this.age);

}

o.showJob = function(){

alert(this.job);

}

return o;

}

var Tom = Person('tom',18,'程序猿');

Tom.showJob();

var Jack = Person('jack',19,'攻城狮');

Jack.showJob();

构造函数

function Person(name,age,job){

this.name = name;

this.age = age;

this.job = job;

this.showName = function(){

alert(

this.name);

}

this.showAge = function(){

alert(this.age);

}

this.showJob = function(){

alert(this.job);

}

}

//new的作用就相当于工厂模式中最开始创建了一个空对象，最后把对象返回

var Bob = new Person('bob',18,'产品汪');

Bob.showJob();

var Alex = new Person('alex',19,'运营喵');

Alex.showJob();

alert(Bob.showName == Alex.showName);//false

原型模式

function Person(name,age,job){

this.name = name;

this.age = age;

this.job = job;

Person.prototype.showName = function(){

alert(

this.name);

}

Person.prototype.showAge = function(){

alert(this.age);

}

Person.prototype.showJob = function(){

alert(this.job);

}

}

//先去自己的对象中找showName函数，再去构造函数的原型找

var Lucy = new Person('lucy',18,'测试鼠');

//重写自身对象中的方法，不会影响其它对象

Lucy.showName = function(){

alert('我的名字是' +

this.name);

}

Lucy.showName();//我的名字是lucy

var Lily = new Person('lily',19,'市场鸡');

Lily.showName();//lily

alert(Lucy.showName == Lily.showName);//false

call和apply的区别

二者都可以改变当前的this，区别在于apply方法要将参数放入数组中再传参

function aa(a,b){

alert('我的this是' + this + ',我的a是' + a + ',我的b是' + b);

}

//我的this是[object Window],我的a是2,我的b是3

// aa(2,3);

//我的this是abc,我的a是2,我的b是3

// aa.call('abc',2,3);

//我的this是abc,我的a是2,我的b是3

aa.apply('abc', [2,3]);

函数的继承

//父类

function Fclass(name, age){

this.name = name;

this.age = age;

}

Fclass.prototype.showName = function(){

alert(

this.name);

}

Fclass.prototype.showAge = function(){

alert(this.age);

}

//子类

function Sclass(name, age, job){

//属性用call或者apply的方式来继承

Fclass.call(this, name, age);

this.job = job;

}

//方法继承：将父类的一个实例赋值给子类的原型属性

Sclass.prototype = new Fclass();

Sclass.prototype.showJob = function(){

alert(this.job);

}

//由于已经继承了父类的属性和方法，所以可以直接调用

var Driver = new Sclass('tom',18,'老司机');

Driver.showName();

Driver.showAge();

Driver.showJob();

jquery介绍

jQuery是目前使用最广泛的javascript函数库。据统计，全世界排名前100万的网站，有46%使用jQuery，远远超过其他库。微软公司甚至把jQuery作为他们的官方库。

jQuery的版本分为1.x系列和2.x、3.x系列，1.x系列兼容低版本的浏览器，2.x、3.x系列放弃支持低版本浏览器，目前使用最多的是1.x系列的。

jquery是一个函数库，一个js文件，页面用script标签引入这个js文件就可以使用。

jQuery加载

$(function(){

var $div = $('#div');//CSS样式怎么写，这里就怎么写

//html()方法相当于原生JS的innerHTML

alert($div.html() + 'jQuery');

})