0%

1
2
var clone = Object.assign({}, {a: 1, b: 2, c: 3});
delete clone.b;

这个不完美

1
var clone2 = Object.assign({}, {a: 1, b: 2, c: 3}, {b: undefined});
1
2
3
4
5
6
7
8
9
const x = {a: 1, b: 2, c: 3, z:26};

const objectWithoutKey = (object, key) => {
const {[key]: deletedKey, ...otherKeys} = object;
return otherKeys;
}

console.log(objectWithoutKey(x, 'b')); // {a: 1, c: 3, z:26}
console.log(x); // {a: 1, b: 2, c: 3, z:26};
1
2
3
const obj = { a: 1, b: 2, c: 3, d: 4 }
const clone = (({ b, c, ...o }) => o)(obj) // remove b and c
console.log(clone)

lodash

1
_.omit(x, 'b')

  • 早安,所有善良而勇敢的人们
  • 坏人们,颤抖吧

关掉 vue has been registered but not used

package.json 的 eslintConfig(如果已经有 eslintrc.js )

1
2
3
"rules": {
"vue/no-unused-components": "off"
}

clone object 三种

1
2
3
4
5
6
7
let a = {a:1,b:{c:{d:2}}}

{...a}

Object.assign({},a)

JSON.parse(JSON.stringify(food))

via https://www.samanthaming.com/tidbits/70-3-ways-to-clone-objects/

padStart

1
2
3
4
5
6
7
8
9
10
const purchase = [
['Masks', '9.99'],
['Shirt', '20.00'],
['Jacket', '200.00'],
['Gloves', '10.00'],
];

purchase.forEach(([item, price]) => {
console.log(item + price.padStart(20 - item.length));
});

两头对齐

1
2
3
4
Masks           9.99
Shirt 20.00
Jacket 200.00
Gloves 10.00
1
2
3
4
5
const bankNumber = '2222 2222 2222 2222';
const last4Digits = bankNumber.slice(-4);

last4Digits.padStart(bankNumber.length, '*');
// ***************2222

类似滴:

  • trimStart(trimLeft) 去除前空格
  • trimEnd(trimRight) 去除后空格
  • trim() 去除前后空格

shadow copy

  • spread operator {…} […]
  • array slice
  • Object.assign
  • Array.from

deep copy

deep copy (or deep clone): lodash _.cloneDeep, Ramda, a custom function, JSON.parse() / JSON.stringify(), and rfdc

For the best performance, the library rfdc (Really Fast Deep Clone) will deep copy about 400% faster than lodash’s _.cloneDeep

https://medium.com/javascript-in-plain-english/how-to-deep-copy-objects-and-arrays-in-javascript-7c911359b089

const a = new Object();

对象字面量

const a = {};

属性增强写法

es5

const a = '123' const obj = { a:a }

es6

const a = '123' const obj = { a } // 属性从同名变量找

函数增强写法

es5

`
const a = {
a:function(){

}
}
`

es6

`
const a = {
a(){

}
}
`

字符串模版

const skill = '安邦' const david =文能${skill}

ES6对象键计算表达式

var heat = '50%'; var field = 'Rock and Roll'; var music = { [field.toLowerCase()]: heat } console.log(music); // Object {rock and roll: "50%"}

对象解构

let music = { type: 'rock', heat: '50%' }; let { type, heat } = music; console.log(type, heat); // rock 50%

对象解构 重命名

let music = { type: 'rock', heat: '50%' } let { type: aaa, heat: bbb } = music; console.log(aaa, bbb); // rock 50%

数组解构

let people = [20, 25, 30] let [young, oldYoung] = people; console.log(young, oldYoung) // 20 25

战斗机

https://zh.wikipedia.org/wiki/%E6%AD%BC-10

11 15 16 20 35 22

mac Add The Recent Items Stack To The Dock

1
defaults write com.apple.dock persistent-others -array-add '{ "tile-data" = {"list-type" = 1; }; "tile-type" = "recents-tile";}' && \killall Dock

signal

手机扫描二维码 藏在 设置 - 已关联设备

将 Signal Desktop 与手机关联的步骤:

安装并打开 Signal Desktop。
在你的手机上,打开信速达转到信速达的设置界面profile_avatar.png > 登录过的设备。
按下+图标(安卓)或是”登录新的设备”(苹果)
用你的手机来扫描二维码。
选取一个你登录过的设备然后点击完成。
从 Signal Desktop 发送一条信息。

1
2
3
4
5
6
7
8
9
var numbers = [15.5, 2.3, 1.1, 4.7];
function getSum(total, num) {
return total + Math.round(num);
}
function myFunction(item) {
var a = numbers.reduce(getSum , 0);
console.log(a)
}
myFunction();
1
2
3
4
5
6
7
8
9
var numbers = [15.5, 2.3, 1.1, 4.7];
function getSum(total, num) {
return total + Math.round(num);
}
function myFunction(item) {
var a = numbers.reduce(getSum);
console.log(a)
}
myFunction();

简单粗暴

1
2
3
4
5
6
<div id="parent">
<user-profile ref="profile"></user-profile>
</div>

var child = this.$refs.profile;
child.x();

总线

in main.js

1
export const bus = new Vue()

in Parent.vue:

1
import {bus} from 'path/to/main'

// Where you wanna call the child’s method:

1
bus.$emit('customEventName', optionalParameter)

in Child.vue:

1
import {bus} from 'path/to/main'

// Add this to the mounted() method in your component options object:

1
bus.$on('customEventName', this.methodYouWannaCall)

总线代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
import ChildForm from './components/ChildForm'

new Vue({
el: '#app',
data: {
item: {},
bus: new Vue(),
},
template: `
<div>
<ChildForm :item="item" :bus="bus" ref="form" />
<button type="submit" @click.prevent="submit">Post</button>
</div>
`,
methods: {
submit() {
this.bus.$emit('submit')
}
},
components: { ChildForm },
})

组件代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<template> </template>
<script>
export default {
name: 'NowForm',
props: ['item', 'bus'],
methods: {
submit() {
...
}
},
mounted() {
this.bus.$on('submit', this.submit)
},
}
</script>

$attrs

组件内,返回 除 class style props 以外的 其他属性

1
console.log(this.$attrs);

$children

1
console.log(this.$root.$children[0].$children[0].$data);

$createElement:

$el:

$listeners:

$options:

$root:

$scopedSlots:

$slots:

$vnode:

event bus 多次触发

$on 的事件可在 created 或 mounted 注册

需在 beforeDestroy 或 destoryed 的时候使用用 $off 销毁

否则在某些情况下会被被多次触发

this.EventBus.$off(‘map_is_ready’);

全部 cancel

this.EventBus.$off();

vue.config.js 中添加

1
2
3
4
5
module.exports = {
devServer: {
host: 'gs' // 本机域名
}
}

本机域名 在

/etc/hosts