小程序-数据类型操作那些事
2018-05-11 本文已影响0人
sky_storming
最近在学习小程序，官方的示例比较简单，学习过程中往往找到想要的答案比较困难，在这里对this.setData()修改或更新String、Number、Boolean、Array、Dictionary类型的值的相关操作做一个简单的总结。
String、Number、Boolean类型的值的修改
- this.setData()之修改String、Number、Boolean类型的值，这三种类型比较简单，直接把新值赋给变量即可。
// 分别声明String、Number、Boolean类型的变量
data: {
str: "",
num: 6,
bools: false,
}
修改以上三个变量的值，代码如下：
this.setData({
str: "this is a new value."
});
this.setData({
num: 0
});
this.setData({
bools: !this.data. isRefresh // 在这里也可以使用运算符
});
Array数组（增删改查）
- this.setData()之修改Array中的元素，这其中涉及数组的增删改查等操作。
// 声明数组
data: {
list1: [1, 2, 3],
list2: ['abc', 'def', 'asc'],
}
- 添加元素
- 使用“push()”函数添加一个元素到数组中，代码如下：
let len = this.data.list1.push('end'); // 添加一个或多个新元素到数组的末尾，并返回数组新的长度
- 使用“unshift()”函数添加一个元素到数组中，代码如下：
let len = this.data.list1.unshift('start'); // 添加一个或多个新元素到数组的开头，并返回数组新的长度
- 使用“concat()”函数，将两个或更多数组合并成一个，代码如下：
this.setData({
list1: this.data.list1.concat(this.data.list2), // 两个或更多数组合并成一个数组，并返回结果
});
console.log('newList: ' + this.data.list1); // 输出结果：1,2,3,abc,def,asc
- 删除元素
- 使用“pop()”函数，删除数组末尾的元素，代码如下：
let last = this.data.list1.pop(); // 删除数组末尾的元素，并返回最后一个元素
- 使用“shift()”函数，删除数组的第一个元素，并返回数组的第一个元素，代码如下：
let first = this.data.list1.shift(); // 删除数组的第一个元素，并返回数组的第一个元素
- 使用“splice()”函数，删除数组中指定下标和删除个数位置的元素；也可在删除的同时，在指定下标位置开始向数组添加一个或多个新元素，代码如下：
| 参数 | 描述 |
|---|---|
| index | 必需。整数，规定添加/删除元素的位置，使用负数可从数组结尾处规定位置。 |
| howmany | 必需。要删除的元素数量。如果设置为 0，则不会删除元素。 |
| item1, ..., itemX | 可选。向数组添加的新元素。 |
var list3 = [1, 2, 3, 4, 5, 6];
let result1 = list3.splice(2, 1); // 结果为：删除元素:3，新数组:1,2,4,5,6
let result2 = list3.splice(2, 2, 'abc', 'abd', 'weq'); // 结果为：删除元素:3,4，新数组:1,2,abc,abd,weq,5,6
let result3 = list3.splice(2, 0, 'abc', 'abd', 'weq'); // 结果为：删除元素:，新数组:1,2,abc,abd,weq,3,4,5,6
注意：该方法会改变原始数组
- 修改元素
- 通过index索引直接将newValue赋值，代码如下：
var lists = [1, 2, 3, 4, 5];
lists[2] = 'aa'; // 结果为：1,2,aa,4,5
- 查询元素
- 通过index索引查询数组中的元素，代码如下：
var lists = [1, 2, 3, 4, 5, 6];
let result = lists[1]; // 查询index为1位置上的元素，结果为：2
- 使用“slice()”函数，查询选定的元素，代码如下：
var lists = [1, 2, 3, 4, 5, 6];
let result = list.slice(1, 3)'; // 结果为：2,3
- 数组转化为字符串
- 使用“toString()”函数，将数组转换为字符串，代码如下：
let str = this.data.list1.toString(); //
- 使用“join()”函数，将数组中的所有元素通过指定的分隔符连接成一个字符串，代码如下：
let str = this.data.list1.join('-'); // 将数组中的所有元素通过指定的分隔符连接成一个字符串，并返回生成的字符串
-
Array 操作的方法列表
这里只是一部分方法，更多方法请参照小程序数据类型
| 方法 | 描述 |
|---|---|
| concat() | 连接两个或更多的数组，并返回结果。 |
| join() | 把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。 |
| pop() | 删除并返回数组的最后一个元素 |
| push() | 向数组的末尾添加一个或更多元素，并返回新的长度。 |
| reverse() | 颠倒数组中元素的顺序。 |
| shift() | 删除并返回数组的第一个元素 |
| slice() | 从某个已有的数组返回选定的元素 |
| sort() | 对数组的元素进行排序 |
| splice() | 删除元素，并向数组添加新元素。 |
| toSource() | 返回该对象的源代码。 |
| toString() | 把数组转换为字符串，并返回结果。 |
| toLocaleString() | 把数组转换为本地数组，并返回结果。 |
| unshift() | 向数组的开头添加一个或更多元素，并返回新的长度。 |
| valueOf() | 返回数组对象的原始值 |
Object对象操作（即Dictionary字典）
object 是一种无序的键值对
object 的 key 可以是字符串，也可以是符合变量定义规则的标识符
object 的 value 可以是任何类型
// 声明示例字典
var dict = {
name: 'alice',
};
- 添加（key, value）键值对
- 直接添加key和value到字典，代码如下：
dict.age = 12; // 结果为：{name: "alice", age: 12}
dict.['height'] = 170; // 结果为：{name: "alice", age: 12, height: 170}
- 修改（key, value）键值对
- 通过“.”或“['']”语法，直接修改key的value，代码如下：
dict.name = 'tom';
console.log('value: ' + dict.name); // 结果为：value: tom
dict['name'] = 'lily';
console.log('value: ' + dict['name']); // 结果为：value: lily
- 在比较复杂的情况下修改对象的值，代码如下：
// 声明数据
data: {
simpleList: [2, 3, 'ads'],
complexList: [{
values: []
}]
}
// 给values赋新值
this.setData({
simpleList: ['wqe', 'ee', 'bgf'],
'complexList[0].values': ['as', 'ds', 1, 2, 6] // 注意这种写法是放在字符串中的
});
- 查询（key, value）键值对
- 通过“.”语法，查询key对应的value值，代码如下：
let value = dict.name;
console.log('value: ' + value); // 结果为：value: alice
- 通过“['']”语法，查询key对应的value值，代码如下：
let value = dict['name'];
console.log('value: ' + value); // 结果为：value: alice
