1：你学会了什么
1.1:使用本地存储存储数据到本地,然后点击标签跳转到另一个页面到另一个页面来获取当前页面所点击的值在它用数据渲染出来.
1.2:以前跳转页面的方法只会用锚点,现在还会location.href这个方法,也会了用history.forward(back)来进行前进和后退.
1.3:对各个页面进行更规范的分类管理,使得结构更清晰,以前写一个项目比如小米商城的时候都是一个html页面,一个css和一个js页面就三个页面没有 更加细致的分类导致有些时候自己看的都有点迷.
1.4:最重要的是学会了用组件给他来封装函数这样以后碰到了相类似的轮播图时只需要该几个值就好了不用麻烦的复制以前写过相类型的代码然后再该太麻烦了.
1.5:登录和注册页面知道用正则表达式来进行判断格式是否正确在用本地存储给它存储到本地中在进行判断等.
2：你的进步有哪些
2.1:通过这个项目让我认识到了命名规范的重要性,在这个项目中有些时候乱命名导致自己都不知道这个是干嘛用的,以后命名要尽量坐到 见名知意这种
2.2:知道了先封装个组件进行ajax请求,然后直接调用就行了,而不是像以前一样,每请求一个接口都要一步一步来获取数据
2.3:写一个项目要先了解这个项目是干什么的,然后业务都要那些对它进行分类管理在一个个业务的做,使结构更清晰
2.4:不会的与别人进行讨论请教之后然后把它搞懂在写出来,写项目时与别人讨论的更多了不想以前都是自己一个人在那自己做自己的
3：你哪里不会
3.1:做分类的时候做到第二级标题的时候要两个for循环时要进行判断那部分不会然后找人教的
3.2:不会自己封装组件,只会简单的完成一个业务在封装函数进行调用
3.3:写返回顶部时触底那部分会,然后点击返回顶部时,没有那种动画效果一开始是闪现会到顶部的通过多人讨论解决了这个问题
3.4:对构造函数与原型对象掌握的还不够熟练
4：总结项目中有那些业务，你是符合实现的
4.1:商品详情给商品详情封装个函数然后如搜索框点击搜索以后跳转到另一个页面渲染出数据时把每张图片用点击事件触发点击以后 给它跳转到商品详情页这样就好了,不用麻烦的每一个页面都要在写一次,
4.2:返回顶部以前写的都是直接闪现的而现在给它开个定时器然后再到一定时间给它清除这样就可以有动画效果给它返回顶部了(如下)
// 返回顶部
var returns = document.querySelector('.return');
var timer = null;
var isTop = true;
//获取页面可视区高度
var clientHeight = document.documentElement.clientHeight;
// console.log(clientHeight);
//滚动条滚动时触发
window.addEventListener('scroll', function () {
//显示回到顶部按钮
var box = document.documentElement;
// 当滚动到底后 让 返回顶部的div显示出来
if (Math.ceil(box.clientHeight + box.scrollTop) == box.scrollHeight) {
getShopList();
}
});
window.addEventListener('scroll', function () {
//显示回到顶部按钮
var osTop = document.documentElement.scrollTop || document.body.scrollTop;
if (osTop > clientHeight) {
returns.style.display = "block";
} else {
returns.style.display = "none";
};
//回到顶部过程中用户滚动滚动条，停止定时器
if (!isTop) {
clearInterval(timer);
};
isTop = false;
});
returns.onclick = function () {
//设置定时器
timer = setInterval(function () {
//获取滚动条距离顶部高度
var osTop = document.documentElement.scrollTop || document.body.scrollTop;
var ispeed = Math.floor(-osTop / 7);
document.documentElement.scrollTop = document.body.scrollTop = osTop + ispeed;
//到达顶部，清除定时器
if (osTop == 0) {
clearInterval(timer);
};
isTop = true;
}, 30);
};};
5：总结你写的项目中有那些技术亮点并详细说明
5.1:分类页面写二级标签时有些人为了方便会直接用字符串模板写,而我写的是直接var div = document.createElement('div'),然后直接appendChild的 这样写虽然麻烦点但是不管以后进行for还是条件判断都可以直接进行判断,而不用像字符串模板这样还要封装个函数在调用进去这样不仅麻烦还可修改性繁琐
5.2:头部的登录注册和购物车以及退出登录的切换,首先先把购物车和退出登录先display:'none',然后判断登录页面跳转到首页时'token'的值是否有,有的话 就把登录和注册切换到购物车和退出登录,然后点退出登录时要用location.href跳转到登录页面在进行登录,这之前要把本地存储的数据用localStorage.removeItem('token'); 给删除掉这样才能登录,不删除的话不管登录还是不登录在那显示的都是登录状态
5.3:触底加载:写这个时直接在渲染页面封装的函数中把page=1;该为page++;然后在渲染页面的前面给它加个盒子这样的话差不多完成了 之后就把这些封装个函数在给它判断一个滑动鼠标时到底部的距离,触底时把这个函数调用下就可以了.
