js+面向对象相关笔记(一)

1.javascript包含 
◆ECMAScript:规定的js的语法规范。
◆DOM:Document Object Model 文档对象模型(一种数据结构),提供了一套操作页面元素的API。
◆BOM:Browser Object Model 浏览器对象模型,也是提供了一套操作浏览器的API。


2.javascript的数类型
◆基本数据类型:string number boolean undefined。
◆复杂数据类型(引用类型):Array、Date、Object、RegExp、String、Boolean、Number、Function、Math、null 、...。
◆空类型:null、undefined。


3.in关键字
◆in关键字可以用来for遍历
◆可以用来判断是否是一个对象的成员的键,如 var obj={name:'zj'}; console.log("name" in obj);//true
◆可以用来判断是否是一个数组的成员的索引,如 var arr=[1,2,3,4];console.log(0 in arr);//true;  


4.时间对象
◆GMT 格里尼治标准时间 (一个天文台制定的时间)
◆UTC 世界协 调时间



5.对象的动态特性
◆当对象被创建出来后,可以使用这个对象加.运算符或使用中括号[]的方式来直接添加新的属性和方法。


6.delete关键字
◆delete关键字用于删除对象的属性,还有未使用var关键字声明的变量。
◆delete关键字有返回值,用来表示删除属性是否成功。
◆如果 删除的是不存在的属性,返回值为true。
◆如果 删除的属性是存在原型当中的,那么就不会删除,但是返回值还是true,不过因为原型中的属性是属于基类的,所以无法真正删除。


7.通过浏览器进行调试(开发人员工具)
◆Elements,可以看到页面的代码,也能够看到页面的样式,还可以看到通过计算后最终的样式,还可以看到,页面的元素的dom对象。
◆Consoles,是拥有和页面的script对一样的环境,可以直接在这里书写js代码。
◆Sources,可以对页面的js 代码进行调试,通过打断点和添加监视项来进行调试的操作,也是这样来获取代码执行的状态和你想要得到的一些信息,调试的操作【
◇点击的是逐过程运行,遇到函数调用,就会直接执行完函数,拿到返回值,不会跑到函数中一步步执行代码。
◇点击的是逐步运行,遇到函数调用,会进到函数里面,一步一步的执行代码,知道执行完函数中所有的代码再跳出函数。
◇点击的是跳出当前函数,这个操作是在逐步运行时在函数里面的时候才能使用的,方便你立即跳出当前函数。
◇点击的是切换断点激活状态,这个操作是让你在打了断点之后,但是暂时还不想使用断点,可以通过切换断点的激活状态为非激活状态来停止当前所有断点的时候,并不会清空掉你打的断点。
◇点击的是启动代码异常时暂停,这个操作是,当你的代码出现错误了,会在出错的一瞬间暂停下来,并且会跳到出错的代码哪里,这样你就能够监视出哪里出现问题了,如果启动了就不会在控制台报错了,而是在报错的地方暂停下来。
◇Watch 是添加监视的表达式,可以手动添加,也可以使用鼠标右键添加,只要书写表达式即可,也 就是js代码。
◇Call Stack 是函数调用栈,一般情况下用不到。
◇Scope 是变量作用域,当你进入函数的时候,会把当前的变量作用域罗列出来。
◇Breakpoints 是断点,当你所有打的断点之后就会在这里面罗列出来,也可以在这里将你打的某个断点取消激活状态。
◇条件断点,这个非常实用,是在打断点的地方右键添加Add conditional breakpoint,然后书写表达式,如你在一个for循环1000次中,那么你写的表达式可以是 i==956,那么就不必一次一次的点击逐步执行了,它就会在i等于956的时候才会进 入断点了。





◆Network,用来监视请求信息的,无论是发送出去的请求还是接收回来的响应,都能够获取到信息,比如说请求报文请求信息和响应报文的响应信息,还有一些其它选项【
◇Preserve log,选中这个复选框,表示保存当前所有的请求,就算你页面跳转也能够保存之前的信息,默认是页面跳转时清空之前的信息。
◇No throttling,切换这个下拉列表,可以模拟用户的在线状态,也就是在不同网速下的运行效果如何。





】。


8.定义函数的三种方式
◆直接声明函数 function funcName(){}
◆使用函数表达式 var functionNmae1=function name(){},可以写name也可以不写,就算你写了name,也没有多大用,因为这个name在函数外部并不能使用,只能在函数内部使用,而且并不是所有浏览器都会支持,因为这种写法并不在标准之内,所以函数表达式最好是使用匿名函数。
◆创建函数对象的方式,var functionaName2=new Function("console.log('haha');");,这种方式与函数表达式的方式类似,指定是原理类似。


9.dom操作(增删改查)
◆获取元素操作:getElementById、getElementsByTagName、getElementsByClassName、getElementsByName
◆元素节点操作:appendChild、insertBefore、removeChild、replaceChild、cloneNode,createElement、createTextNode(创建文本节点)
◆属性节点操作:getAttribute、setAttribute、removeAttribute
◆常用的DOM属性:className、innerHTML、innerText/textContent、value、children


10.异常处理 
◆异常捕获关键字: try catch finally
◆异常捕获完整语法:【
try {
a();
//可能会出现的问题的代码
} catch(e) {
console.log(e);//e表示异常信息
//出现异常后的处理代码
}finally {
//不管有没有异常,这里的代码都会执行
console.log("finally");
//实际上这个地方在node.js中使用
//做为释放资源的操作。
}

◆异常最大的特征,就是一旦出现代码异常,后面的代码就不会再执行,为了保证后面代码在出现异常之后,后面的代码能够继续执行,那么就需要使用异常捕获,异常捕获之后就不会影响剩下的代码执行了。
◆自定义异常:手动抛出异常使用throw关键字,如【
try {
throw "你的代码坏掉了,赶快修修";
}catch(e) {
console.log(e);
}

★但是语法错误就捕获不了,因为js在预解析时就会检查语法错误,而捕获异常是在js执行时才会进行。


11.面向过程与面向对象
◆面向过程的思维方式:就是把解决问题的关注点,放到解决问题的每一个详细的步骤上面(方法)!如【
洗衣服:
1.收集衣服
2.打开洗衣机盖子
3.把衣服放进去
4.关洗衣机盖子
5.设定洗衣程序
6.打开洗衣机盖子
7.晾衣服
8.收衣服

◆面向对象的思维方式:就是把解决问题的关注点,放到解决问题需要的一系列对象身上,如【
洗衣服:
1.找个女朋友

◆面向过程与面向对象的思维方式进行对比

☆去餐馆吃饭
◇面向过程的思维方式【
1.进餐馆
2.点菜
3.做菜
4.上菜
5.吃菜
6.结账
7.拍拍屁股走人

◇面向过程的思维方式【
1.我
2.餐馆


★面向过程就像是一个公司里的员工,它做的都是最底层的,需要注意每一个详细的步骤,只有这样才能做好,出了问题就需要去找每一个详细步骤,然后解决问题。
★面向对象就像是一个公司里的老板,它要做什么只需要下一个命令然后命令下面的员工去做,具体详细步骤老板不管,让底下的员工去就可以了,出了问题就找员工,让员工再去解决问题。


12.类与对象
◆对象:万物皆对象,对象是一个具体的事物,它有具体的特征,也正是因为这些特征才能够描述某一个具体的对象。
◆编程中的对象是由特征和行为组成,如人的特征有name age gender height,人的行为有 吃 跑 跳 睡 唱 抽烟 喝酒 烫头。
◆在js当中,键值对儿的组合就是对象。


13.封装
◆使用函数来进行封装,会出现全局变量的污染,因为函数要放到最外面,并且函数名不能够重复,如果重复了可读性也不好,因为你不知道你调用的哪一个,并且在js中,后面的函数会覆盖掉前面的函数,并且在最外面写那么多函数,维护起来很麻烦,看起来代码的结构不是很清晰。
◆使用对象进行封装,会将一些变量和函数放到对象中,相当于给了那些变量和函数一个命名空间,那么就不会造成变量的全局污染,并且维护起来很方便,因为只需要找到对应的对象,然后不断更新对象的特征和行为即可,但是使用对象封装实际上就是给原来那些变量还有函数分配了指定的合适的命名空间,也就是把对应的变量和函数以键值对的方式放到一个对象中,使用的时候可以通过对象.的方式和对象[]的方式来进行调用。
◆使用函数来进行封装的好处是,能够小范围的将代码划分为一个功能模块儿,防止重复性代码的出现,但是封装的函数是全局的,也就是说不能够重名,而且维护的时候有点麻烦。
◆使用对象来进行封装的好处是,暴露在全局的只有一个对象名,不会造成全局变量的污染,在对象中也可以进行函数的封装,并且这样更加利于将代码进行功能模块儿的划分,有利于日后的维护。
posted @ 2018-06-15 09:53  我叫贾文利  阅读(70)  评论(0编辑  收藏  举报