Sanwich's Blog
0%

Day39

發表於

MDN - JavaScript Guide

Numbers and dates

binary: 0b1111
octal: 0o777 or 0777(含數字>8 就會轉為十進制)
hexadecimal: 0xABCD
BigInt: 2n (無法與number運算)

Text formatting

‘string’, “string”, new String(‘string’) 

1
2
3
4
const hello = 'Hello, World!';
const helloLength = hello.length;
hello[0] = 'L'; // This has no effect, because strings are immutable
hello[0]; // This returns "H"

如上述，無法以 index 變更 string 內容，需使用 function 如 replace()
template literal: `for multi-line and ${expression}`

註: regular expression 小節被我跳過了，雖然很重要，但實在太長

Indexed collections

[element0, element1], new Array(element0, element1), Array(element0, element1)
concat(), join(), push(), pop(), shift(), unshift(), splice(), sort()
打下來不知道有什麼用，反正要用到再查==

Keyed collections

Map

1
2
3
4
5
6
7
8
9
10
11
const sayings = new Map();
sayings.set('dog', 'woof');
sayings.size; 
sayings.get('dog'); // woof
sayings.has('bird'); // false
sayings.delete('dog');
for (const [key, value] of sayings) {
  console.log(`${key} goes ${value}`);
}
sayings.clear();
sayings.size; // 0
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
const mySet = new Set();
mySet.add(1);
mySet.add('some text');
mySet.add('foo');

mySet.has(1); // true
mySet.delete('foo');
mySet.size; // 2

for (const item of mySet) {
  console.log(item);
}
// 1
// "some text"

Map 與 Object 差別:

  1. Object 的 key 是 String 或 Symbol，Map 則無限制
  2. Map可輕易計算大小: Map.size

Array 與 Set 差別:

  1. 使用 splice() 刪除 array element 非常慢，而 Set 可直接使用值來刪除
  2. Set 儲存不重複的值

WeakSet: 只能儲存 Object，如果 Object 沒有與外連結可能會被回收(garbage collected)；無法查看當前 Set 裡的內容
WeakMap: key 為 Object，同樣無法使用 enumeration 查看 key 狀態；可用於保護內容 (private, hide implementation details)

Working with objects

{key: value}, new Object()
dot notation: myCar.model
bracket notation: myCar[‘model’]

constructor function: 

1
2
3
4
5
6
7
function Car(make, model, year) {
  this.make = make;
  this.model = model;
  this.year = year;
  this.displayCar = displayCar;
}
const myCar = new Car('Eagle', 'Talon TSi', 1993);

Object.create method: 

1
2
3
const fish = Object.create(Animal);
fish.type = 'Fishes';
fish.displayType(); // Output: Fishes

Adding properties to defined object using prototype

1
2
Car.prototype.color = null;
car1.color = 'black';

Methods:

1
2
3
4
5
function displayCar() {
  const result = `A Beautiful ${this.year} ${this.make} ${this.model}`;
  prettyPrint(result);
}
car1.displayCar();

objects are a reference type

1
2
3
4
5
6
7
8
9
10
11
// Two variables, a single object
const fruit = {name: 'apple'};
const fruitbear = fruit;  // Assign fruit object reference to fruitbear

// Here fruit and fruitbear are pointing to same object
fruit == fruitbear; // return true
fruit === fruitbear; // return true

fruit.name = 'grape';
console.log(fruitbear); // output: { name: "grape" }, instead of { name: "apple" }

心得

今天學到最重要的事情大概是 String 不能直接以 index 來更改值，和 Object 傳的是 reference，但還是不太清楚。明天再看一下 Object 的 getter 和 setter有什麼用

雖然知道 regular expression 很重要，但大量無互動的文字實在是讓我想睡覺，明天再回頭看，或使用不同的資源學

考慮交互學習不同的內容，因為晚上看影片時似乎有耳目一新的感覺