day1
1、animate.css文件是一个动画库:放着很多很多的动画。
如何使用:
1、打开百度:搜索animate.css 得到网址
http://www.animate.net.cn/
https://animate.style/
2、下载 - 你们不用做这个操作
3、引入此文件
4、挑选你喜欢的动画,把class放到那个元素上
5、并且要记得设置上animation-duration:3s; 执行时长
6、还需要根据不同的动画,设置不同的初始效果,才会更好看
day04
面向对象:是一个开发方式,更符合现实生活,所有的数据都包含在一个事物之中,一个方法调用多个方法联动
1、封装:3种
1、直接量:
var obj={
属性名:属性值,
...
方法名:function(){操作},
...
}
2、预定义构造函数:
var obj=new Object();//空对象
3、批量创建多个对象:自定义构造函数
1、创建构造函数
function 类名(name,age,hobby){
this.name=name;
this.age=age;
this.hobby=hobby;
}
2、调用构造函数创建出对象:
var xx=new 类名("袍哥",18,"吹牛");
细节:
1、访问属性和方法
obj.属性名; === obj["属性名"];
obj.方法名(); === obj["方法名"]();
2、可以随时随地添加新东西
obj.属性名=属性值;
obj.方法名=function(){};
3、访问到不存在的属性名或方法名,返回的undefined
4、遍历出对象的所有东西,必须使用for in循环
for(var i in obj){
obj[i]
}
5、在对象的方法中,想要使用对象自己的属性必须写为:this.属性名
难点:this的指向:
1、单个元素绑定事件,this->这个元素
2、多个元素绑定事件,this->当前元素
3、定时器中的this->window
4、箭头函数this->外部对象
5、函数中this->谁在调用此方法,this就是谁
6、构造函数之中this->当前正在创建的对象
2、继承:父对象的东西,子对象可以直接使用,代码重用,节约内存空间!从而提升网站的性能!
找原型对象(爸爸):
1、对象名.__proto__
2、构造函数名.prototype;
找到原型对象,可以设置共有属性和【共有方法】
原型对象.属性名=属性值;
原型对象.方法名=function(){};
day5
1、面试和笔试:继承
1、判断自有和共有
if(obj.hasOwnProperty("属性名")){
//自有
}else{
if("属性名" in obj){//in关键字会在obj的原型链上查找此属性
//共有
}else{
//没有
}
}
2、修改和删除自有和共有
自有:
修改:obj.属性名=新值;
删除:delete obj.属性名;
共有:
修改:obj.属性名=新值;//危险:是在本地添加了一个同名属性,其实根本没有修改到原型对象
删除:delete obj.属性名;.//无效的
注意:操作一定要先找到原型对象
3、为一类人添加方法:为老IE的数组添加indexOf
if(Array.prototype.indexOf===undefined){
Array.prototype.indexOf=function(key,starti){
starti===undefined&&(starti=0);
for(var i=starti;i<this.length;i++){
if(this[i]==key){
return i
}
}
return -1;
}
}
4、判断x是不是数组:4种
1、判读x是不是继承自Array.prototype
Array.prototype.isPrototypeOf(x);
2、判断x是不是由Array这个构造函数创建的
x instanceof Array
3、ES5:Array.isArray(x);
4、多态:Object.prototype.Tostring.call/apply(x)==="[object Array]"
5、自定义继承:
两个对象之间设置继承:
子对象.__proto__=父对象
批量设置继承:
构造函数名.prototype=父对象;//注意时机:先设置继承再创建对象
2、两链一包:
原型链:每个对象都有一个叫做.__proto__的操作,可以一层一层的找到自己的原型,最顶层的叫做Object的原型,形成的一条链式结构
作用:找属性和方法
作用域链:是以函数的EC的scope chain属性为起点,经过AO,逐级引用,形成的一条链式结构
作用:带来了变量的使用规则,找变量
闭包:希望保护一个可以反复使用的局部变量的一种此法结构
function outer(){
创建受保护的变量
return function(){
操作受保护的变量
return 结果;
}
}
var 内层函数=outer();
外层函数调用几次,受保护的变量就创建了几个副本,我们的闭包就创建了几份
同一次外层函数调用,返回的内层函数,都是在操作同一个受保护的变量
受保护的变量永远不会被释放,使用过多,会导致内存泄漏,软件崩溃
用于:防抖节流:
1、elem.onmousemove
2、input.oninput
3、window.onresize