js面向对象

概述

做一一些事，可以将他们封装为函数，反复调用。

如果这些事很多，且不同事情之间有关联关系，假如十件事写成10个函数

没有逻辑无序编排，且很有可能多个事情会公用数据。

编写后的代码杂乱无章。

OOP：封装信息，用特征与行为将一类事物提炼抽象出来。

基本语法同java，也借鉴了python的语法。

数据类型同java，下面就是一些需要记忆的点。

创建对象

1-构造函数创建

var stu = new object() stu.name="zhang" stu.hobby="rap" stu.draw=function(){}

2-字面量方式创建对象

var stu = { name:"zhansan", age:18, draw:function(){ 　　 console.log(this.name) } }

以key：value对的形式描述对象，key必须是字符串，因为此约定，不用加双引号。

stu["name"]===stu.name后者简单

但是当不知道属性名时才会不得已使用【】

例如遍历对象

for(let key in stu){ console.log(stu[key]) }不知道对象的属性名，也不知道有多少属性key变量指向stu的属性名。 this

解析器在调用函数时每次都会向函数内部传递一个隐含的参数this，

this指向的是函数执行的上下文,白话就是.前面的对象。

stu.draw() 和python中的self一样

alert(123)呢？

对于js中的函数而言，this指向的是window对象。

即便是自定义的函数，也是挂在window对象下面。

var stu = { 　　name:"zhangsan", draw(){ console.log(this) } }var stu1_draw = stu.drawstu.draw() //{name: "zhangsan", draw: ?}stu1_draw()//Window {window: Window, self: Window, document: document, name: "", location: Location, …}

js中除了默认传this，还会默认传数组对象arguemnts，是个数组，里面放所有传进来的参数，可以用索引 *** 作实参。

js中的类模板

批量创建某类对象

如果创建对象每次都var stu={}

且还是相同属性和行为的对象，就太麻烦了

funciton Student(name,age){ this.name =name this.age=age this.draw=function(){ console.log(this.name+this.age) } }1--Student("dage",20) 不加new，同样可以创建对象，只不过里面的this指的就是window,就相当于调用了一个函数，为全局window创建了两个变量2--加上new之后，new做了一件事，创建一个新的对象，让函数内部的this指向新的对象。此时的函数就是构造函数。 sut1 = new Student("zhansan",19) stu2 = new Student("lisi",19）Student（）就是一个普通函数，如果加了new就变成了构造函数。而Studen大写就是一个约定而已，完全可以小写，但是规范要遵守。

es6中引入了class关键字，替换上面的function

class Student{ constructor(name,age){ this.name=name; this.age=age;　　　　 this.draw=function(){} } }

写的多了，还赶不上上面的简便。

但是陷阱是函数对象，每次创建对象都单独创建了函数对象，造成内存浪费，但是这个函数应该是共享的一块内存。

js提供了解决方案---原型

原型

所有学生相同的行为全部放在原型里面----相当于一块共享内存。

所有的对象都有一个prototype对象，用来指定原型

创建任何一个函数，不管你是不是构造函数，解析器都会向函数中添加一个prototype属性，即原型对象。

如果是一个普通函数，那么原型对象对它而言没有用处。

class Student{ constructor(name,age){ this.name=name; this.age=age; 　　　}　　 draw()()//提出来即可 } funciton Student(name,age){ this.name =name this.age=age　　　　//设置原型对象，此对象里面的全部共享。 this.prototype.draw=function(){ console.log(this.name+this.age) } }

 

json数据

不同语言交流方式

json和js的对象表达方式很像

但是key必须用双引号引起来，单引号不可以，跟js的对象长得太像了，可能这就是为什么js对象的key不加双引号吧

｛ “name ”:"zh", "age":18, "hello":function(){ //几乎不会传函数 console.log("hello world") } ｝

ajax异步加载数据后端传来的都是json格式数据

一般调试看到的数据已经转为了js对象 

js面向对象