四个JS小技巧

2019-07-16

一、尽早结束

function transformData(rawData) {
  // check if no data
  if (!rawData) {
    return [];
  }

  // check for specific case
  if (rawData.length == 1) {
    return [];
  }

  // actual function code goes here
  return rawData.map(item => item);
}

阅读全文

数组、对象的深拷贝

2019-06-30

数组的深拷贝

function copyObjectArray(x) {
  return [...JSON.parse(JSON.stringify(x))];
}

// example 1
const test = [
  {
    name: 'Amy',
    age: 18,
  },
];
let test1 = copyObjectArray(test);
test1[0].name = 'Jack';
console.log(test, test1);
// test: [ { name: 'Amy', age: 18 } ] test1: [ { name: 'Jack', age: 18 } ]

阅读全文

初始化可伸缩数组

2019-06-30

Demo

let len = 5;

// method1
let arr = Array(len)
  .fill(null)
  .map((v, i) => String.fromCharCode(65 + i));
// method2
let arr = Array.apply(null, { length: len }).map((v, i) => String.fromCharCode(65 + i));

console.log(arr); //[ 'A', 'B', 'C', 'D', 'E' ]

阅读全文

对象属性值监听

2019-06-30

Demo

let data = {
  title: 'hello world!',
};

function definePropertyData(obj, prop, value) {
  Object.defineProperty(obj, prop, {
    get: function() {
      console.log(111);
      return value;
    },
    set: function(newValue) {
      value = newValue;
    },
  });
}

definePropertyData(data, 'title', data.title);

console.log(data.title); // 111 hello world!
data.title = 38;
console.log(data.title); // 111 38

阅读全文

代码优化

2019-06-30

用 vue 进行前端开发，怎么做到函数式编程呢？

每次做完项目，都会发现自己在代码的解耦，接口的封装方面做的还不够，后期必定会多次进行优化，在优化的过程中，就想到，如何把零散的代码，编程整体性更强的代码，使人一看到就知道手脚在哪里。在这里我的总结是，按功能点进行函数的封装，一个大点是一个函数，这个大点里面又有很多小点，可以把函数赋值给变量，进行使用，这样就不用每次都跳来跳去了，维护起来也更方便快捷。

阅读全文

时间戳转日期

2019-06-30

Demo

function timeStampFormat(x) {
  const date = new Date(+x * 1000);
  const [m, d] = [date.getMonth() + 1, date.getDate()];
  return `${m}-${d}`;
}
const day = timeStampFormat(1560751917);
console.log(day);