基本类型
数值(数字):Number
涉及到的 任何关于NaN的操作,都会返回NaN
NaN不等于自身。
注意 NaN不是一个数值,但他是number类型
类型转化
null 转 number: 结果为 0 ; Number(null)// 0
Undefined转number: 结果为NaN;
布尔 转 number 结果:
console.log(Number(ture)) //1
console.log(Number(false)) //0
空字符串 转 number 结果
console.log(Number(' ')) //0
var arr2 = '12.31.54';
console.log(Number(arr2)); //NaN
var arr3 = '123nx';
console.log(Number(arr3)); //NaN
var arr4 = '你好';
console.log(Number(arr4)); //NaN
'注意:数字前面有零的就省率0'
var arr5 = '012138';
console.log(Number(arr5)); //12138
**parseInt()取整**
var a = '123';
console.log(parseInt(a)); //123
var b = '13.14';
console.log(parseInt(b));//12
var c = '12.31.14';
console.log(parseInt(c)); //12
var d = '你好';
console.log(parseInt(d)); //NaN
var e = 'w123';
console.log(parseInt(e)); //NaN
var r = '123w';
console.log(parseInt(r)); //123
**parseFloat()取浮点数**
var a = '123';
console.log(parseFloat(a)); //123
var b = '12.12';
console.log(parseFloat(b)); //12.12
var c = '12.31.14';
console.log(parseFloat(c));//12.31
var d = '你好';
console.log(parseFloat(d)); //NaN
var e = 'w12.31'
console.log(parseFloat(e));// NaN
var r = '12.31w';
console.log(parseFloat(r));//12.31
**isNaN() 检测是否是非数字**
console.1og (isNaN(123)) ://false
console.1og (isNaN("123a")) ://true
console. log (isNaN(true)) ://false
**+号转整型**
let a = '123'
+a = 123
let a = '123a'
+a = NaN
let a = undefined
+a = NaN
let a = null
+a = 0
字符串:String 类型转化任意转
命名未赋值:Undefined
布尔类型:Boolean
转化
Boolean() !!
空类型:Null
判断类型
引用数据类型
对象类型
修改值
let d = {
a:1,
b:2
}
this.$set(d,'a',2)
d.a = 2
监听
watch:{
'd.a'(n,o){
},
'd.b':{
handler (n, o) {},
deep: true
}
}
数组类型
修改值
let arr = [
{
a:1
},
{
a:2
}
]
push()函数,向数组尾部添加元素
pop()函,从数组尾部删除元素
unshift()函数,向数组头部添加元素
shift()函数,从数组头部删除元素
splice(arr,index,1)
sort()
reverse()
this.$set(this.arr,index,newData) // Vue.set()
this.$set(this.arr[index],a,1) // Vue.set()
以上会改变源数据
以下不会,会返回新数组
filter()
concat()
slice()
监听
watch:{
'd.0.a'(n,o){
}
}
## 数据对比
set数组之前先深拷贝
深拷贝用 lodash
import lodash from 'lodash'
lodash.cloneDeep(data)
import debounce from 'lodash/debounce' //防抖
import throttle from 'lodash/throttle' //节流
@change="debounceGetInfo()"
debounceGetInfo: debounce(function() {
this.getInfo()
// throttle debounce
}, 500),
data() {
this.lastFetchId = 0
this.fetchUser = debounce(this.fetchUser, 800)
}
fetchUser(value) {
let params = { current: 1, fuzzy: value, size: 999 }
this.lastFetchId += 1
const fetchId = this.lastFetchId
this.data = []
this.fetching = true
onLineEndApi
.employeePage(params)
.then((res) => {
console.log(res, 11)
if (fetchId !== this.lastFetchId) {
return
}
const data =
(res &&
res.data &&
res.data.records.map((user) => ({
text: `${user.employeeName}<${user.email}>`,
value: user.employeeCode,
employeeCode: user.employeeCode,
name: user.employeeName,
email: user.email,
}))) ||
[]
this.receiverData = data
this.allSearchList = this.allSearchList.concat(this.receiverData)
this.fetching = false
console.log(this.receiverData, 11)
})
.catch((err) => {
this.fetching = false
})
},
数组更新父子组件
view页面 表格数据源为 dataSource
watch: {
dataSource: {
deep: true,
immediate: true,
handler(curr, old) {
if (curr) {
curr.map((v, i) => {
this.$emit('changeTable', this.dataSource) // 父组件接收值
})
}
},
},
},
data() {
return {
TableInfo,
dataSource: lodash.cloneDeep(this.array), //初始化数据父传来的,设置v-if 父表拿到数据再渲染子组件
}
},