目录(知识点)
1.面向对象编程
2.使用面向对象方式开发一个页面的步骤
(1)基本结构
(2)按需调用函数
3.日期对象的在项目中的使用
(1)手写一个格式化日期的方法
(2)使用momont库格式化日期
4.数组对象在项目中的使用
(1)forEach
(2)filter
(3)map
(4)find和findIndex
5.正则表达式在项目中的使用
6.本地缓存
网站制作的九大方面
详情
(一) 面向对象编程
1.概念
(1)1. 面向对象程序设计(Object Oriented Programming,OOP)是一种计算机编程架构。OOP的一条基本原则是计算机程序由单个能够起到子程序作用的单元或对象组合而成。OOP达到了软件工程的三个主要目标:重用性、灵活性和扩展性。
(2) 特点: 封装,继承,多态
2.面向对象知识点
(1)理解对象以及访问对象的两种表示法
(2)'this'的含义
(2.1)谁调用就指向谁
(2.2)this在某些情况想会改变指向
(2.3)this指向改变的解决办法
var self = this; // this改变的时候,self不会改变
(2.4)手动改变this的指向
// 用bind绑定this的指向,让this不管什么情况下都指向同样的对象
var obj = {
init: function() {
this.a = 100;
this.loading = true;
},
test: function() {
console.log('this',this);
console.log('a', this.a);
}
}
obj.init();
// var fn = obj.test;
// 让fun的this指向obj
var fn = obj.test.bind(obj);
obj.test(); // this => obj a=100
window.fn(); // this => window a=100
bind和call&apply的异同
1.都能改变this的指向
2.bind是在函数没运行之前使用,call&apply使用函数就马上调用
(四) 数组在项目的使用
文档地址: https://www.runoob.com/jsref/jsref-obj-array.html
1.forEach 调用时传入一个函数,数组每个元素都执行一次回调函数。
2.filter 检测数值元素,并返回符合条件所有元素的数
var students = [
{username: '张三',sex: '男'},
{username: 'lisi',sex: '女'},
{username: '王五',sex: '男'}
]
// 查找所有男同学
var man = students.filter(function(item) {
// 查找条件
return item.sex === '男'
});
console.log('man',man);
// 练习,把所有热门城市找出来
var cityList = [{
"cityId": 110100,
"name": "北京",
"pinyin": "beijing",
"isHot": 1
},
{
"cityId": 120100,
"name": "天津",
"pinyin": "tianjin",
"isHot": 0
},
{
"cityId": 130100,
"name": "石家庄",
"pinyin": "shijia",
"isHot": 0
},
{
"cityId": 130200,
"name": "唐山",
"pinyin": "tangshan",
"isHot": 0
}
]
// 使用filter
var hotCity = cityList.filter(function(item) {
return item.isHot === 1;
})
// 使用for循环
var hostCity = [];
for (var i=0;i<cityList.length;i++) {
var item = cityList[i];
if (item.isHot === 1) {
hostCity.push(item);
}
}
console.log(hostCity);
3.indexof判断一个成员是否在数组中,若在,返回成员的下标,不在就返回-1;
4.map 通过指定函数处理数组的每个元素,并返回处理后的数组。
5.find 返回符合传入测试(函数)条件的数组元素。
6.findIndex 返回符合传入测试(函数)条件的数组元素索引。
7.数组去重