2020/6/3工作日报

159 阅读3分钟

实训二马上就两个星期了,要写简历,准备资料,早上背完面试题,自习课我们组就开语音商讨了一下,上午讲的也很轻松,js工具库Lodash

Lodash
是一个一致性、模块化、高性能的 JavaScript 实用工具库,它里面封装了很多js方法,比如我们的对象方法,数组方法
,字符串,Function的,Date日期,我们要是使用的话会很方便,不用再去写原生的join,concat这些方法

下载:npm i --save lodash

使用一个方法要 _.来调用,比如:
var array = [1];
var other = _.concat(array, 2, [3], [[4]]);
console.log(other); //[1, 2, 3, [4]]
这个方法就相当于我们原生的concat拼接方法
再举个例子:
var arr = [1,2,3,4]
console.log(_.indexOf(arr, 2));  //3
indexof查找,找到就返回1,找不到就返回-1
还有很多方法,可以看它的一个文档
https://www.lodashjs.com/docs/latest#_indexofarray-value-fromindex0

animate.css

Animate.css是一个可在您的Web项目中使用的即用型跨浏览器动画库。非常适合强调,首页,滑块和引导注意的提示。
下载:npm install animate.css --save

安装Animate.css之后,将该类animate__animated以及任何动画名称添加到元素中(不要忘记animate__前缀!)
<h1 class="animate__animated animate__bounce">An animated element</h1>
各种动画的方法都在文档中
https://animate.style/

深拷贝浅拷贝

数据分为基本数据类型和引用数据类型,他也叫对象类型,浅拷贝和深拷贝都是针对引用数据类型,当我们声明一个变量,
js会把变量名放入到栈内存中,对应的是这个变量名的值,例如:
var a=1;
var b=a;
a=2;
我修改了a的值,但会发现a的值变了,但b的值不会变,因为我栈内存中a,b的值都是1,但是a,b两个变量没有关系,
a是a,b是b,修改了a,b不会变
区分基本数据类型和引用数据类型就这样来区分

当我们创建个对象时,它会把对象放入到堆内存中,开辟一个新的空间,这个新空间没有名字,只有一个地址,而我们的
变量名它还是放入到我们栈内存中,但对应的不是值了,而是我们在堆内存中开辟的新空间地址,举个例子:
var a ={name:'李四'}
var b=a;
a.name='李五'
结果肯定是a改变了,b也改变了,因为他们两个变量指向的是同一个堆内存中那个地址,所以一个发生改变,另一个也会
发生改变

实现浅拷贝的方法
Object.assign()  将第二个参数及以后的参数合并到第一个对象里。
var obj = {a:{name:"kaiqin",age:19}};
 var obj1 = Object.assign({},obj);
 obj1.a.name="wang"
 console.log(obj1)
 console.log(obj)
    
深拷贝
方法一:对象是单层的情况下
Object.assign()
var obj = {a:1,b:2,c:3}
var obj1 = Object.assign({},obj);
obj1.a = 30;
console.log(obj1,obj)

方法二:JSON.parse、JSON.stringfiy
var obj1 = {b:{name:"wang",age:19}};
var obj2 = JSON.parse(JSON.stringify(obj1));   //此时地址发生了改变。
obj2.b.name = "kaiqin";
console.log(obj1,obj2)

方法三:通过递归的方法来实现

jsDOM

document.getElementById :根据ID查找元素,大小写敏感,如果有多个结果,只返回第一个;
document.getElementsByClassName :根据类名查找元素 
document.getElementsByTagName :根据标签查找元素, * 表示查询所有标签,返回一个 HTMLCollection 。
document.getElementsByName :根据元素的name属性查找,返回一个 NodeList 。
document.querySelector :返回单个Node,IE8+(含),如果匹配到多个结果,只返回第一个。
document.querySelectorAll :返回一个 NodeList ,IE8+(含)。
document.forms :获取当前页面所有form,返回一个 HTMLCollection ;

晚上看了关于ATM自动取款机的视频,了解了它的一个用途,包括他的里面是怎么来检查存钱的时候有假钱的,各种安全问题