0%

d3

1
npm install --save d3

if TypeScript

1
npm install --save-dev @types/d3
1
import * as d3 from "d3";

1
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash

查看

1
nvm ls

使用最新

1
nvm use node

设置默认

1
nvm alias default v12.13.0
1
2
3
4
5
6
7
8
9
10
11
12
$ nvm use 16
Now using node v16.9.1 (npm v7.21.1)
$ node -v
v16.9.1
$ nvm use 14
Now using node v14.18.0 (npm v6.14.15)
$ node -v
v14.18.0
$ nvm install 12
Now using node v12.22.6 (npm v6.14.5)
$ node -v
v12.22.6

阅读内容 录音

1
say -f 1.txt -o 1.aiff

转 mp3

1
lame -m m 1.aiff 1.mp3

clientX vs pageX

1
2
3
4
5
6
let i = 0;

while (i < scores.length) {
console.log(scores[i]);
i++;
}
1
2
3
4
5
6
let i = 0;

do {
console.log(scores[i]);
i++;
} while (i < scores.length);
1
2
3
for (let i = 0; i < scores.length; i++) {
console.log(scores[i]);
}
1
2
3
for (i in scores) {
console.log(scores[i]);
}
1
2
3
for (score of scores) {
console.log(score);
}

forEach

map

reduce

reduceRight

flatMap

filter

every

some

indexOf

lastIndexOf

find

findIndex

keys

entries

includes

Spread …

via https://www.w3schools.com/js/js_array_iteration.asp

via https://www.w3schools.com/jsref/jsref_obj_array.asp

at

1
2
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fruit = fruits.at(-2);

array.slice(start, end)

The slice() method does not change the original array.

array.splice(index, howmany, item1, ….., itemX)

The splice() method overwrites the original array.

copyWithin

array.copyWithin(target, start, end)

Tools -> Developer -> New Snippet…

1
2
3
4
5
6
<snippet>
<content><![CDATA[console.log($1);$0]]></content>
<tabTrigger>log</tabTrigger>
<scope>text.plain,source.js,source.ts</scope>
<description>console.log()</description>
</snippet>

保存为 log.sublime-snippet

使用:

log+回车

npm –save 和–save-dev的区别

使用–save 安装的包是项目发布之后还需要依赖的包, 如axiox , express等包,等项目上线以后还需使用。

使用–save-dev 安装的包则是开发时依赖的包,等项目上线则不会使。

npm install 和 npm i 是一样

–save 和 -S 是一样
–save-dev 和 -D 是一样的

tsc

1
2
3
4
npm i tsc -D
npx tsc --init

npx tsc -w

任何 1.ts 生成 1.js

也可以修改 tsconfig.json 配置

1
2
// "outFile":"./",
// "outDir": "./",

类型

  • boolean

  • number

  • string

  • Explicit

  • Implicit

1
let firstName: string = "Dylan";

unknown 比 any 安全

1
2
3
let w: unknown = 1;

let v: any = true;

date 性能

1
2
3
Date.now()  // 最快
new Date().getTime();
+new Date // 最慢

via https://www.measurethat.net/Benchmarks/Show/9412/0/new-date-vs-new-dategettime-vs-datenow-100k

interface 和 type 区别

  • 接口是通过继承的方式来扩展,类型别名是通过 & 来扩展。
  • 接口可以自动合并,而类型别名不行

https://zhuanlan.zhihu.com/p/351213183

到底应该用 type 还是 interface ?
Because an interface more closely maps how JavaScript objects work by being open to extension, we recommend using an interface over a type alias when possible.
On the other hand, if you can’t express some shape with an interface and you need to use a union or tuple type, type aliases are usually the way to go.

意思是说能用 interface 的地方就用 interface,否则用 type,其实这个解释官方说的也比较明确,这样使用的原因是因为更贴合 JavaScript 对象的工作方式,再清晰一些,如果我们是定义一个 object,那么最好是使用 interface 去做类型声明,什么时候用 type 呢,当定义一个 function 的时候,用 type 会更好一些

1
2
3
4
// the `?` operator here marks parameter `c` as optional
function add(a: number, b: number, c?: number) {
return a + b + (c || 0);
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
class Person {
private name: string;

public constructor(a: string) {
this.name = a;
}

public getName(): string {
return this.name;
}
}

const person = new Person('david');

console.log(person)

//console.log(person.name)

console.log(person.getName())

class Property ‘’ has no initializer and is not definitely assigned in the constructor

  1. tsconfig.json 关掉严格
1
2
3
"compilerOptions": {
"strictPropertyInitialization":false
}
  1. undefined
1
employees : Employee[] | undefined;
  1. definite assignment assertion
1
employees!: Employee[];
  1. init
1
employees: Employee[] = [];
  1. Assignment in the Constructor

employees: Employee[];

constructor() {
this.employees=[];
}

super

父级构造函数

?? 对比 ||

使用 ?? 时,只有当值1为null或undefined时才返回值2;

使用 || 时,值1会转换为布尔值判断,为true返回值1,false 返回值2

0: Main button pressed, usually the left button or the un-initialized state

1: Auxiliary button pressed, usually the wheel button or the middle button (if present)

2: Secondary button pressed, usually the right button

3: Fourth button, typically the Browser Back button

4: Fifth button, typically the Browser Forward button

下载的美剧是1目录1集,想考出来

a1/a1.mp4
a2/a2.mp4

->

a1.mp4
a2.mp4

1
find . -type f -exec mv {} ./ \;

报错!重名!

a1.mp4/a1.mp4
a2.mp4/a2.mp4

1
find . -type f -exec mv {} ../ \;

那就往上一层(然后删除空目录,再考回去)