JavaScript 进阶营

ES(ECMAScript)知识点总结(二)

2020-03-20  本文已影响0人  文艺的程序狗
  1. 项目搭建
    初始化项目 npm install -y(y为全部默认yes),就会在当前目录生成package.json
    babel:把ES6转换为ES5 安装依赖 npm install -g babel-cli(-g 全局安装)
    在根目录下新建.babelrc
.babelrc
{
    "presets":["es2015"],
    "plugins":[]
}
  1. 变量
    变量赋值有三种方式 var let const
    var:全局变量 会污染下面要使用的地方
    let:局部变量 内存会更优化
    const:常量 不可变

for(var i = 0; i<3;i++){
    console.log(i)
}
console.log(i);
//0,1,2
//3


for(var j = 0; j<3;j++){
    console.log(j)
}
console.log(j);
//0,1,2
//undefined
  1. 结构赋值
    数组解构赋值 [] = []
    对象解构赋值{} = {}
    字符串解构赋值
    默认值
let [x,y,z] = [1,2,3]
console.log(x);
console.log(y);
console.log(z);


let {a,b,c} = {a:'1',b:'2',c:'3'};
console.log(a);
console.log(b);
console.log(c);

let [a1,b1,c1,d1,e1] = 'hello';
console.log(a1);
console.log(b1);
console.log(c1);
console.log(d1);
console.log(e1);
  1. 扩展运算符&rest
    扩展运算符:...对象
    rest:参数,最后一个
let q = [1,2,3];
let w = [4,...q];
for (let tp of w){
    console.log(tp);
}
  1. 字符串模板
    1. 该样式的字符串``,里面的变量用${var}
    2. 支持html标签
    3. 计算结果
      字符串方法
      startsWith,endsWith repeat,includes
let name = 'Jack Tang'
var hello = `${name}是好学生,<br\>数学很好,会算1+1=${1+1}`
document.write(hello);
console.log(hello.includes('Tang'));
console.log(hello.startsWith('是',9))
console.log(hello.endsWith('Jack',4))
//true true true
  1. 数字操作
    二进制0b
    八进制0o
    判断是否是数字 NaN
    是否是整数

let num = 0b10;
let num1 = 0o10;
console.log(num);
console.log(num1);
console.log( !Object.is(num,NaN));
console.log(Number.isInteger(num));
// 2,8 true,true
  1. 数组(2)
    json数组格式 Array.from
    Array.of 参数组合成数组
    arr.find() 实例方法
    for of 自动循环取
    arr.entries()手动取

let json = {
    '0':'tmlong',
    '1':'M',
    '2':'18',
    length:3
}
let unknowns = Array.from(json);
let of = Array.of(1,2,3,4);
let strings = unknowns.fill('hello',0,1);

console.log(unknowns);
let entries = unknowns.entries();
console.log(entries.next().value)
console.log(strings);
console.log(of);
//['tmlong','M','18']
//[0,'hello']
//['hello','M','18']
//[1,2,3,4]
  1. 函数扩展
    箭头函数(不能用new 构造,一条语句 省略return)
    默认值
    参数个数
let myfunction = () => 'nice';
let myfunction1 = (a,b=1,...c) => {
    let tmp = a+b+c+'ha';
    return tmp;
}

console.log(myfunction());
console.log(myfunction1('a','b','c'));
console.log(myfunction1.length);
//'nice'
//'abcha'
//1
  1. 对象
    key值构建
    自定义对象方法
var t = {
['name'] = 'tmlong'
}
var tt = {
    add:function(a,b){
    return a+b;
    }   
}
let a = {a1:'nice'}
let b = {b1:'day'}
var tp =Object.assign(a,b);
console.log(t.name);
console.log(tt.add(1,2));
console.log(tp);
//'tmlong'
//3
//{a:'nice',b:'day'}
  1. Symbol类型
    是一种类型,不可以new
    对象保护,循环的时候不许出
    let tp = Symbol('nice');
    11&12. Set&Map
    可以放入任何格式
    Set
    集合,会自动去重
    方法:has add del clear
    WeakSet 构造函数不传参 只能add
    Map
    key value 形式
let wq = new Map();
let fds = {
    a:function () {
        return 'ce';
    }
}
wq.set('name',fds);
wq.set('age',18);


let newVar = wq.get('name');
wq.delete('name');
console.log(newVar);

let nn = new Set(['tml','18']);
nn.add(fds);
nn.clear();
console.log(nn)
for (let tp of nn){
    console.log(tp);
}
  1. Proxy
    代理:正式执行前的预处理,变量和方法
    set 设置值之前预处理
    get 获取值之前预处理
    apply 方法预处理

  2. Promise
    主要解决回调地狱 new Promise(function).then(val)

  3. Class
    里面多个函数不需要加逗号

  4. 模块化操作
    import 引入模块
    export 导出模块 可以多个 引入需要大括号
    export 导出模块 default 只能一个 引入不需要大括号,且可以有别名

上一篇下一篇

猜你喜欢

热点阅读