平時工做和學習中遇到的知識點（2）

1三、meta標籤的用法

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<!-- 默認使用最新瀏覽器 -->
<meta http-equiv="Cache-Control" content="no-siteapp">
<!-- 不被網頁(加速)轉碼 -->
<meta name="robots" content="index,follow">
<!-- 搜索引擎抓取 -->
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
<meta name="apple-mobile-web-app-capable" content="yes">
<!-- 刪除蘋果默認的工具欄和菜單欄 -->
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<!-- 設置蘋果工具欄顏色 -->

<meta name="format-detection" content="telephone=no">
<meta name="format-detection" content="date=no">
<meta name="format-detection" content="address=no">
<meta name="format-detection" content="email=no">
<!--關閉iOS上的內容識別-->

http://www.alenqi.site/2018/03/04/complete-tags/
<!--別人總結好的meta的連接-->

1四、隨機生成的加密字符串庫（crypto-random-string）

$ npm install crypto-random-string //安裝命令

const cryptoRandomString = require('crypto-random-string');
 
cryptoRandomString({length: 10});
//=> '2cf05d94db'
 
cryptoRandomString({length: 10, type: 'base64'});
//=> 'YMiMbaQl6I'
 
cryptoRandomString({length: 10, type: 'url-safe'});
//=> 'YN-tqc8pOw'
 
cryptoRandomString({length: 10, characters: '1234567890'});
//=> '1791935639'

1五、瀏覽器的微觀任務和宏觀任務

//宏觀任務是瀏覽器宿主api發起的任務 例：setTimeout
    //微觀任務 JavaScript引擎發起的任務 例：promise
    //每一個宏觀任務都有一個微觀任務隊列
    //promise會加到宏觀任務的最後
    
    var r = new Promise(function(resolve, reject){
        console.log("a");
        resolve()
    });
    r.then(() => console.log("c"));
    console.log("b")
    //a,b,c

1六、lodash庫

Lodash 經過下降 array、number、objects、string 等等的使用難度從而讓 JavaScript 變得更簡單。 Lodash 的模塊化方法 很是適用於：

  遍歷 array、object 和 string
  對值進行操做和檢測
  建立符合功能的函數
  
  // Load the full build.
  var _ = require('lodash');
  // Load the core build.
  var _ = require('lodash/core');
  // Load the FP build for immutable auto-curried iteratee-first data-last methods.
  var fp = require('lodash/fp');
   
  // Load method categories.
  var array = require('lodash/array');
  var object = require('lodash/fp/object');
   
  // Cherry-pick methods for smaller browserify/rollup/webpack bundles.
  var at = require('lodash/at');
  var curryN = require('lodash/fp/curryN');

1七、小練習

題目：咱們如今要實現一個紅綠燈，
把一個圓形 div 按照綠色 3 秒，
黃色 1 秒，紅色 2 秒循環改變背景色
fuction sleep(duration){
    return new Promise((resove,reject) =>{
        setTimeout(resove,duration)
    })
}
sleep(2000).then(function(){
    
})

1八、上下文的概念

JavaScript 標準把一段代碼（包括函數），
執行所需的全部信息定義爲：「執行上下文」。

1九、上傳圖片本地預覽功能

uploadChange(file) {
    console.log(file)
    let blobUrl
    try {
      blobUrl = URL.createObjectURL(file.raw)
    } catch (err) {
      console.error("[Element Error][Upload]", err)
    }
    console.log(blobUrl)
  },
  

URL.createObjectURL() 靜態方法會建立一個 DOMString，
其中包含一個表示參數中給出的對象的URL。
這個 URL 的生命週期和建立它的窗口中的 document 綁定。
這個新的URL 對象表示指定的 File 對象或 Blob 對象。

用 URL.revokeObjectURL() 方法來釋放內存

20、every和some方法

every()是對數組中每一項運行給定函數，
若是該函數對每一項返回true,則返回true。

some()是對數組中每一項運行給定函數，
若是該函數對任一項返回true，則返回true。

const tempData = [
  {
    id: 1,
    name: "rocker",
    adress: "US"
  },
  {
    id: 2,
    name: "rocker",
    adress: "US"
  },
  {
    id: 3,
    name: "rocker",
    adress: "US"
  }
];
let everyReturn = tempData.every((item, index) => {
  return item.id > 1;
});
let someReturn = tempData.some((item, index) => {
  return item.id > 2;
});

console.log(everyReturn);
//有一個是錯的就返回 false 且的關係

console.log(someReturn);
//有一個是對的就返回 true 或的關係

2一、npm

查看可用的npm源
nrm ls

// 用法： nrm use ***
nrm use taobao
// 切換以後可用 nrm ls查看是否已經切換了npm源

2二、前端總結(github優質資源整理)

https://juejin.im/post/5d3edad9f265da03a652f133

2三、JavaScript定義函數的幾種方式

一、普通函數

function foo(){
    //code
}

二、箭頭函數

const foo = () => {
    //code
}

三、class中定義的函數

class Rectangle {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
}
//函數聲明   會提高
//類聲明     不會提高

2四、講個笑話

佩奇有天放學回家對媽媽抱怨說：同窗們都說我長得像吹風機
媽媽平靜的看着佩奇：說話就說話，你別拿嘴吹我

2五、深拷貝

//方法1
JSON.parse(JSON.stringify())
//方法2 ES6
const arr1=[1,2,3];
const arr2=Array.from(arr1）
//方法3
用lodash的cloneDeep
//方法4  concat 方法會返回一個新數組