computed 默认情况下只有getter ,不过你也可以提供一个setter
computed: {
// 默认下只有getter
// fullName() {
// return this.fireName + this.lastName
// }
// 完整写法
fullName: {
get() {
return this.fireName + ' ' + this.lastName
},
// setter是对计算属性直接赋值时触发,回调参数为设置的值
set(val) {
console.log(val)
// 使用空格把字符串分割成数组
let arr = val.split(' ')
console.log(arr)
// 数组的第一个元素就是姓
this.fireName = arr[0] ? arr[0] : ''
// 数组的第二个元素就是名字
this.lastName = arr[1] ? arr[1] : ''
}
}
}
一些数组的常用方法
数组名.reduce(回调函数,pre的初始值)
arr.reduce(function (totla, current) {
}
reduce这个方法被调用时,会遍历这个数组的每一个元素,每遍历一个元素,就执行一侧这里的代码
里面的参数:
current(第二个参数)表示当前正在遍历的这个元素
totla (第一个参数)表示 上一次 的这个函数return 的值
!!!因为第一次遍历没有上一个return值,所以交给了第二个参数,设置totla的初始值
!!!并且reduce方法最终会返回一次return的值
举个计算总数的例子:
let arr =[1,2,3]
arr.reduce(function(pre,item)=>{
pre +=item
//pre 就是arr数组的总数
return pre
}
)
map()方法
返回值是一个新数组,新数组中的元素为原始数组中处理过后得到的值
不会改变原数组
实例:
let arr2 = [
{ name: 'alex', age: 18, sex: 0 },
{ name: 'tom', age: 8, sex: 1 },
{ name: 'sky', age: 22, sex: 0 },
{ name: 'roy', age: 6, sex: 1 },
{ name: '表妹', age: 16, sex: 0 },
{ name: '表姐', age: 18, sex: 0 },
{ name: '表哥', age: 26, sex: 1 },
]
let res2 = arr2.map(item => {
// 1. 添加成年信息
if (item.age >= 18) {
item.a = '已成年'
} else {
item.a = '未成年'
}
// 2. 添加性别信息
if (item.sex == 1) {
item.sexStr = '男'
} else {
item.sexStr = '女'
}
return item
})
console.log(res2)
filter()方法:
function isBigEnough(element) {
return element >= 10;
}
var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44]
* map与filter的区别
* map是把返回值用于数组元素生成
* filter通过返回值是否为true决定把当前的元素放新数组中。
localStorage
永久储存,只要不主动删除,就会一直存在,一般不用于保存敏感信息
1.储存格式是以键值对格式存在的
let user = {
name: '小明',
age: 18,
sex: 1
}
2.需要把对象变成json格式的字符串进行保存
let user_json = JSON.stringify(user)
3.设置数据方法
第一个值是变量名,第二个是数据 (设置的数据只能是字符串)
localStorage.setItem('user', user_json)
4.调用数据的方法
localStorage.getItem('user')
调用的数据内容是字符串,所以要转换成原来的格式
5.数据转换
let userRes = JSON.parse(localStorage.getItem('user'))
然后就可以拿到数据啦
6.清除数据
localStorage.clear()
SessionStorage
会话储存,会话结束自动消失,浏览器关闭后,数据会自动销毁,安全性要更高
格式同上
PS:本地存储方式因为安全性的原因是跟随网站使用的。不同的网站会有不同的Storage。
别的网站是访问不了其它网站Storage
cookie需要大家扩展,然后回来教我