# JavaScript 基本用法
###### tags: `JavaScript`
## 物件陣列的判斷 [{},{}]:
用map將要判斷的物件陣列成新的陣列
再透過新的陣列去做判斷
```
var result = array.map(value => value.property)
```
## JavaScript取出”陣列-物件“重複/不重複值的方法
```
result = arr.filter(item => !set.has(item.name) ? set.add(item.name) : false);
```
# 2018/10/30學習筆記
## Array.splice用法 splice(index位置,刪除數,新增資料)
```
array.splice(0,1) //刪除index=0的資料
```
## FormData使用
```
var fileData = new FormData();
fileData.append("key",value) //新增
fileData.delete(key) //刪除
fileData.get(key) //取得值
for (var value of fileData.values()) { //取出全部值
console.log(value);
}
```
## for in 與 of 在陣列及物件上的不同
```
for( index in array){} //index
for( value of array){} //值
for( key in obj){} //key
for( value of obj){}
```
## async await
```
function sleep(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
}
async function demo() {
console.log('Taking a break...');
await sleep(2000);
console.log('Two second later');
}
demo();
```
## 最簡單的callback function
```
var funcA = function(callback){
window.setTimeout(function(){
//要先做的事情........
// 如果 callback 是個函式就呼叫它
if( typeof callback === 'function' ){
callback();
}
}, 0);
};
var funcB = function(){
//等先做的事完成後再做的事情........
};
funcA( funcB ); // 將 funcB 作為參數帶入 funcA()
```
## map 產生新的array
```
var array1 = [1, 4, 9, 16];
var array2 = array1.map(x => x * 2);
var array1 = [{"a":1},{"a":2}];
var array2 = array1.map(el => {return el.a*4});
```
## A && B 、 A || B 用法
```
var x = A && B && C
var x = A || B || C
```
## 刪除array重複值
```
方法1:
var deduped = [ 1, 1, 'a', 'a' ].filter( (el, i, arr) => arr.indexOf(el) === i);
方法2:
var deduped = Array.from( new Set([ 1, 1, 'a', 'a' ]) );
```
## 刪除object重複值
```
function dedup(arr) {
var hashTable = {};
return arr.filter(function (el) {
var key = JSON.stringify(el); //js的物件key不會分辨 1 與 '1' 所以要用stringify轉換
var match = Boolean(hashTable[key]);
return (match ? false : hashTable[key] = true);
});
}
```
## ???
```
for( let i = 0; i < 5; i++ ) {
window.setTimeout(function() {
console.log(i);
}, 1000);
}
for( var i = 0; i < 5; i++ ) {
window.setTimeout(function() {
console.log(i);
}, 1000);
}
```
```
function sleep(ms) {
console.log("123")
return new Promise(resolve => setTimeout(resolve, ms));
}
var funcC =async function(callback){
await sleep(2000);
// 如果 callback 是個函式就呼叫它
if( typeof callback === 'function' ){
callback();
}
};
funcC(function(){console.log("456")})
```
```
for (let i = 0, p = Promise.resolve(); i < 10; i++) {
p = p.then(_ => new Promise(resolve =>
setTimeout(function () {
console.log(i);
resolve();
}, Math.random() * 1000)
));
}
```
```
(async function loop() {
for (let i = 0; i < 10; i++) {
await new Promise(resolve => setTimeout(resolve, Math.random() * 1000));
console.log(i);
}
})();
```
```
function a(){
var deferred = $.Deferred();
setTimeout(function(){
console.log("status in a:",deferred.state());
//this should trigger calling a or not?
deferred.resolve("from a");
},500);
console.log("a");
return deferred.promise();
}
function b(){
var deferred = $.Deferred();
setTimeout(function(){
console.log("status in b:",deferred.state());
deferred.resolve("from b");
},1000);
console.log("b");
return deferred.promise();
}
//synchronous function
function c(){
var deferred = $.Deferred();
console.log("c");
console.log("status in c:",deferred.state());
deferred.resolve("from c");
return deferred.promise();
}
function test(){
var d = jQuery.Deferred(),
p=d.promise();
//instead of the loop doing the following has the same output
p.then(a).then(b).then(c);
console.log(d)
d.resolve();
}
test();
```
## Array 用法表
![](https://ithelp.ithome.com.tw/upload/images/20190905/20106426KHsqUz9TBx.png
"出處 https://ithelp.ithome.com.tw/articles/10213787")