01学习 JS面向对象笔记

2018-02-26 08:13:21来源:cnblogs.com作者:少_主人点击

分享

一切皆对象

属性:升高 体重

方法:唱歌 跳舞 打招呼

数据类型:字符串、数字、布尔、数组、对象、Null、Undefined (面试会考)

Null:空 false

Undefined 没有声明 false

面向对象 键值对


数据类型:字符串 数组 布尔 对象 NAN undefined

---------------------------------

知识点1

创建对象

三种方法


第一种 通过new

关键字来创建

var obj = new Object();obj.name="shaozhu"obj.age=22obj.sex=156obj.shaozhu=function(){return this.age;};


第二种(对象字面量 )

2.1简单字面量 通过隐式

var obj2={};obj2.name="shaozhu"obj2.age=22obj2.sex=156obj2.shaozhu=function(){return this.age;};

2.2嵌套字面量

var obj3 = {mame:"shaozhu",age:18,todo:function(){console.log(this.name);}address:'wh'}

注意:最后一个不要加逗号

如果key有空格和特殊符号 保留字 那么value 要加引号。!!!!

---------------------------------

知识点2

函数表达式 和 函数声明的区别


function add(){} 函数声明

var addl = function(){} 函数表达式


--函数声明预加载先 可以在函数前调用函数

--函数表达式 预加载慢,不能在函数前面调用函数

---------------------------------

构造函数

function Shaozhu(age,name){this.age = age;this.name = name;this.todo = function(){console.log(this.name);}}var s = new Shaozhu(22,"xiaoyi");s.todo();

注意:首字母大写

声明一个构造函数 3

function Person(name,age){this.name=name;this.age=age;this.todo = function(){return this.name;}}

实例化:

var person = new Person("shaozhu",22);

调用:调用的时候 是用 person var 后面的 例如

person.nameperson.todo();


构造函数中的this 指的是的实例化的那个对象 不是指的Person

var aa = new Person('shaozhu',22); //aa.age
var bb = new Person('cole',23); //bb.age


优点:同一个方法 可以实例化多个然后去使用 构造函数可以通用!


返回一个对象

function person(name,age){var obj = new Object();obj.name = name;obj.age = age;return obj;//返回对象}var a1 = person('qqq',23);//这种方法就不用new 了 里面new了a1.name'qqq'

上面这个模式称为 工厂模式


普通模式 就是日常的函数

以后写插件 公用的 构造器用的特别的多!!


构造函数都要通过new 来调用的

---------------------------------

总结:构造函数与普通函数的区别

1.this 指向

--构造函数的this 指向创建对象的实例上 !!!

--普通函数 指向调用者

2.调用方式

NEW new

3.命名方式
构造函数首字母大写!!


----------------------------------------------


通过面向对象来写功能

注意点 :jq 选择器 带上父元素 权重大 不会出问题 (别人可能也写了这个类 )

嵌套字面量 好东西!!


获取浏览器的宽高

document.body.clientwidth

document.body.clientwidth

document.body.clientheight


例子:把一个简单的例子 换成对象字面量


嵌套字面量 好东西!!

最新文章

123

最新摄影

微信扫一扫

第七城市微信公众平台