数组、字符串、对象

数组、字符串、对象

一、转化

1.字符串转对象

// const 对象=JSON.parse(字符串)

const obj = JSON.parse(this.response);
console.log(obj);  // 对象

2.对象转字符串

// const 字符串=JSON.stringify(对象)
const objstr = JSON.stringify(obj);
console.log(objstr);


//把data 转成 a=b&c=d
const data = {
        bookname: "1从入门到精通1",
        author: "我自己",
        publisher: "黑马出版社",
        appkey: "wanshao1234",
      };
      // 把data 转成 a=b&c=d ....  URLSearchParams
      const usp = new URLSearchParams(data);
      const query = usp.toString();

3.字符串转数组

str="abc"
// 第一种 split 拆分
arr=字符串.split('')   // arr=str.split('')  =>arr=["a","b","c"]

// 第二种 [...]
arr=[...字符串]   // arr=[...str]   =>arr=["a","b","c"]

// 第三种
arr=Array.from(字符串 )  // arr=Array.from(字符串 )   =>arr=["a","b","c"]

4.数组转字符串

// 数组 补充 常用
const arr = ["a", "b", "c", "d"];
// console.log(arr.join("")); // join 数组转字符串
// console.log(arr.join("-")); // a-b-c-d 数组转字符串

5.数组转对象

const arr = [
  { label: '男', value: 0 },
  { label: '女', value: 1 }
]
function f(arr) {
  const obj = {}
  for (let i = 0; i < arr.length; i++) {
    obj[arr[i].value] = arr[i].label
  }
  return obj
}
const obj = f(arr) // obj ===> {0: '男', 1:'女'}
console.log(obj)

6.数组转set对象

      /* 
      1 set对象 是es6 才推出 
      2 主要的功能 去重处理  
         set.add(1);
      3 set是一个对象，不是一个数组！！ 
      4 实现 使用set转成数组的时候，需要考虑 （set对象转-数组    数组 - 转成对象）
        数组 - 转成对象  new Set(beforeArr)
        set对象转-数组   const arr=[...set];

       */


      //  0 有时候 先设置一个初始数组 里面已经存在一些数据
      // 在创建set的对象的时候，把数组传给它
      const beforeArr=['a','b',3,4];

      //  1 set对象 需要被new 出来
      const set = new Set(beforeArr);// 数组转成set对象

7.set对象转数组

          // 数组转成set对象
          let set = new Set(arr);

          // 给set添加数据的时候 使用 add方法
          set.add(this.value);

          // set对象转-数组 
          arr = [...set];

8.对象转数组

const obj = { 0: '男', 1: '女' }
function f(obj) {
  let arr = []
  for (let key in obj) {
    // console.log(key, typeof key)
    arr.push({ label: obj[key], value: +key })
  }
  return arr
}
const arr = f(obj) // arr ===>  [{label: '男', value: 0},{label: '女', value: 1}]
console.log(arr)

9.伪数组转真正数组

      // 获取dom 元素 伪数组
      const lis = document.querySelectorAll("li");

      const list = domToArr(lis);

      // list.splice(0,1);
      console.log(list);

      // 定义一个函数 负责将伪数组 转成真正的数组
      function domToArr(domList) {
        // 定义一个空数组
        const arr = [];
        // 对伪数组 进行遍历
        for (let index = 0; index < domList.length; index++) {
          arr.push(domList[index]); // 把dom元素取出来 装到真正的数组中
        }

        return arr;
      }

二、拼接

1.数组与数组拼接

// 连接  数组和数组之间连接   数组1.concat(数组2)
const arr1 = ['1', '2', '3'];
const arr2 = ['a', 'b', 'c'];
// 将两个数组合并成一个数组
console.log(arr1.concat(arr2));

2.字符串拼接

//字符串也有一个 concat 也是表示合并
const str1 = "123";
const str2 = "abc";
console.log(str1.concat(str2));// 很少用  有什么用？ 当你的键盘 + 键坏  使用它
console.log(str1 + str2); // 更加简单好理解

三、字符串大小写转化

// 1 转大写  toUpperCase()

// 2 转小写 toLowerCase()

// 转大写 转小写。
let msg = 'HELLODFDFDFDFDFD';
// 广告 msg 大写
// msg="HELLO";// 搞定  楼下大妈也会！！！  low 低级 不堪入目
console.log(msg.toUpperCase());
// 转小写
console.log(msg.toLowerCase()); //转成小写