#关于ES6

对象的取值

let obj={
    
    
	a:1,
	b:2,
	c:3
}
let  a = obj.a;
let  b = obj.b;
let  c = obj.c;
// 完全可以这样写
const {
    
    a ,b ,c } = obj || {
    
    }
// 注意 解构赋值 不能结构 undefiend , null 所以后面默认个空对象
//如果变量名和属性名不一样 你还可以这样写
const {
    
    a:a1} = obj 
console.log( a1 ) // 1

结构数组对象

合并数组 合并对象 不要用concat()assign()

let a = [ 1, 2, 3 ]
let b = [ 4 ,5 ,6 ]
let  c = a.conact(b) // [1 , 2, 3, 4, 5, 6,]
//换成这种写法
let c = [ ...a,...b ] // [ 1, 2, 3, 4 ,5, 6]
//对象也一样
const obj1 = {
    
    
 a:1,
}
const obj2 = {
    
    
 b:1,
}
const obj3 = Object.assign({
    
    },obj1.obj2) // { a :1, b:2}
//改成解构赋值
const obj3 = {
    
     ...obj1 , ...obj2 } // { a :1, b:2}

顺便补充一句 数组去重 [...newSet( c )]

拼接字符

let name = "小黑"
let age = 18;
if( age < 18 && age > 28 ){
    
    
	console.log( `${
      
       name } 的年龄符合要求` )
}else{
    
    
	console.log( `${
      
       name } 的年龄不符合要求`}
//改成这样事儿滴
consolg.log( ` ${
      
      name}  age < 18 && age > 28 ? 的年龄符合要求 : 的年龄不符合要求 ` )

数组实例方法includes

if( tem == 1 ||	tem == 4 ||	tem == 3 ||){
    
    
	....
}
//改成 
let condition = [ 1, 2, 3];
if( condition.includes( tem ) ){
    
    
	...
}

filterfind

const a = [1,2,3,4,5];
const result = a.filter( 
  item =>{
    
    
    return item === 3
  }
)
// filter 可以改成find
const result = a.find( ....){
    
    }
//当然 这个看实际需求 find方法中找到符合条件的项,就不会继续遍历数组;

扁平化数组flat

const deps = {
    
    
'采购部':[1,2,3],
'人事部':[5,8,12],
'行政部':[5,14,79],
'运输部':[3,64,105],
}
let member = [];
for (let item in deps){
    
    
    const value = deps[item];
    if(Array.isArray(value)){
    
    
        member = [...member,...value]
    }
}
member = [...new Set(member)];
//或者
let arr = [...new Set( [].concat( [...Object.values(deps)] )]; 
//这样做的问题是 ...只能展开2维数组 所以
let arr =  [...new Set(  Object.values(deps).flat(Infinity) ]; 
// ! Infinity 作为 flat的参数 意思问无穷 , 就是无穷大维度数组都可以解开, 你也可以写 2


//顺便在提一个函数 some  和 filter 类似  filter 返回一个数组 some  返回 boolean值
// !!! some() 方法用于检测数组中的元素是否满足指定条件 ,some 不会改变原有数组
let arr = [  [1,2], [3], [4]]
arr.some(item => Array.isArray(item))  // true

空值合并运算符??

if(value !== null && value !== undefined && value !== ''){
    
    
    //...
}
//改成
if((value??'') !== ''){
    
    
  //...
}
//空值合并运算符??是一个逻辑操作符, 当左侧的操作符为 null 或者 undefined 时, 返回其右侧操作数, 否则返回左侧操作数
const a = null ?? 1; // 1
const b = undefined ?? 'foo'; // foo
//或者
if(!!value ){
    
    
    //value有内容才执行的代码...  
}

promise async/await

const fn1 = () =>{
    
    
  return new Promise((resolve, reject) => {
    
    
    setTimeout(() => {
    
    
      resolve(1);
    }, 300);
  });
}
const fn2 = () =>{
    
    
  return new Promise((resolve, reject) => {
    
    
    setTimeout(() => {
    
    
      resolve(2);
    }, 600);
  });
}
const fn = () =>{
    
    
   fn1().then(res1 =>{
    
    
      console.log(res1);// 1
      fn2().then(res2 =>{
    
    
        console.log(res2)
      })
   })
}
// 或者这样写
const fn = async () =>{
    
    
  const res1 = await fn1();
  const res2 = await fn2();
  console.log(res1);// 1
  console.log(res2);// 2
}
//如果并发请求时 就Promise.all()。
const fn = () =>{
    
    
   Promise.all([fn1(),fn2()]).then(res =>{
    
    
       console.log(res);// [1,2]
   }) 
}
//如果并发请求时,只要其中一个异步函数处理完成,就返回结果,要用到Promise.race()。

おすすめ

転載: blog.csdn.net/weixin_48640463/article/details/121422894