13、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的链接-->

14、随机生成的加密字符串库(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'

15、浏览器的微观任务和宏观任务

    //宏观任务是浏览器宿主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

16、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');

17、小练习

题目:我们现在要实现一个红绿灯,
把一个圆形 div 按照绿色 3 秒,
黄色 1 秒,红色 2 秒循环改变背景色
fuction sleep(duration){
    return new Promise((resove,reject) =>{
        setTimeout(resove,duration)
    })
}
sleep(2000).then(function(){
    
})

18、上下文的概念

JavaScript 标准把一段代码(包括函数),
执行所需的所有信息定义为:“执行上下文”。

19、上传图片本地预览功能

  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 或的关系

21、npm

查看可用的npm源
nrm ls

// 用法: nrm use ***
nrm use taobao
// 切换之后可用 nrm ls查看是否已经切换了npm源

22、前端总结(github优质资源整理)

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

23、JavaScript定义函数的几种方式

1、普通函数
function foo(){
    //code
}
2、箭头函数
const foo = () => {
    //code
}
3、class中定义的函数
class Rectangle {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
}
//函数声明   会提升
//类声明     不会提升

24、讲个笑话

佩奇有天放学回家对妈妈抱怨说:同学们都说我长得像吹风机
妈妈平静的看着佩奇:说话就说话,你别拿嘴吹我

25、深拷贝

//方法1
JSON.parse(JSON.stringify())
//方法2 ES6
const arr1=[1,2,3];
const arr2=Array.from(arr1)
//方法3
用lodash的cloneDeep
//方法4  concat 方法会返回一个新数组

weborockfeller
60 声望0 粉丝

前端工程师