注:本文通过yck前端面试小册学习整理而得,记录下来供自己查阅

1.var 变量提升

使用var声明的变量,声明会被提升到作用域的顶部

举几个例子:

eg1:

console.log(a) // undefined
var a = 1

可以看做这样

var a
console.log(a)
a=1

eg2:

var a = 10
var a
console.log(a) //

可以看作

var a;
var a;
a=10;
console.log(a)

eg3,函数声明也会提升,函数提升会把整个函数挪到作用域顶部:

console.log(a) // ƒ a() {}
var a = 1
function a() {}

看作:

var a;
function a() {}
console.log(a) // ƒ a() {}
a = 1

2.var,let,const对比

1.在全局作用域下,var声明的变量,会挂载到window上,其他二者不会

2.三者都存在提升,但是let,const的提升和var不同:虽然变量在编译的环节中就被告知在这块作用域中可以访问,但是访问是受限制的(形成暂时性死区):

所以let const必须先声明后使用

var a = 1;
function test1(){
console.log(a);
} function test2(){
console.log(a);
let a; // 执行到上一步时就已经知道该作用域内有a,所以不会再往外层作用域找,但是形成了暂时性死区,这里的a无法访问
} test1() //
test2() // error, a is undefined

3.let 和 const 作用基本一致,但是后者声明的变量不能再次赋值

3.模块化

3.1为什么要模块化?

  1、解决命名冲突

  2、易于复用

  3、增强可维护性

3.2实现模块化的方法有哪些?各有什么特点?

1、立即执行函数

通过函数作用域解决了命名冲突和污染全局作用域的问题

return出对外接口

(function(val){
function aaaa (){}
return {
a: aaaa
}
})(value)

2.CMD和AMD

// AMD 异步加载模块
define(['./a', './b'], function(a, b) {
// 加载模块完毕可以使用
a.do()
b.do()
})
// CMD
define(function(require, exports, module) {
// 加载模块
// 可以把 require 写在函数体的任意地方实现延迟加载
var a = require('./a')
a.doSomething()
})

3.CommonJS 仍在广泛使用

关键字 require module.exports

// a.js
module.exports = {
a: 1
}
// or
exports.a = 1 // b.js
var module = require('./a.js')
module.a // -> log 1

4.ES Module

// 导出模块 API
export default function() {} // a.js 整块导出
export function b() {} // b.js 导出多个部分,每块有自己的名字 // 引入模块 API
import X from './a.js'
import { b } from './b.js'

4.Proxy

let proxy = new Proxy(target, handler)

拦截,代理。用于自定义对象中的操作

vue3.0中用Proxy来代替原有的Object.defineProperty来实现数据响应式

简版例子

// 用Reflect上的静态方法确保原有的set,get行为,用setBind, getLogger部署额外的监听功能
let onWatch = (obj, setBind, getLogger) => {
let handler = {
get(target, property, receiver) {
getLogger(target, property)
return Reflect.get(target, property, receiver)
},
set(target, property, value, receiver) {
setBind(value, property)
return Reflect.set(target, property, value)
}
}
return new Proxy(obj, handler)
} let obj = { a: 1 }
let p = onWatch(
obj,
(v, property) => {
console.log(`监听到属性${property}改变为${v}`)
},
(target, property) => {
console.log(`'${property}' = ${target[property]}`)
}
)
p.a = 2 // 监听到属性a改变
p.a // 'a' = 2

5.数组方法map, filter, reduce

map:生成新数组。遍历原数组,将原数组的每个元素拿出来做出一些变换后,放入新数组并返回

filter:生成新数组。遍历原数组时,将返回值为true的元素放入新数组,并返回。用于删除一些不需要的元素

它们都接收三个参数:当前元素,索引,原数组

reduce:累加器

const arr = [1, 2, 3]
const sum = arr.reduce((acc, current,index,arr) => acc + current, 0)
console.log(sum) //
const reduceArray = arr.reduce((acc, current) => {
acc.push(current * 2)
return acc
}, [])
console.log(mapArray, reduceArray) // [2, 4, 6]

reduce接收两个参数:回调函数和初始值

回调函数有4个参数:累计值(不限数据类型),当前元素,当前索引,原数组

ES6部分知识点总结的更多相关文章

  1. ES6重点知识点总结(2)

    ES6重点知识点总结(2) call和apply的作用是什么?区别是什么? call和apply的功能基本相同,都是实现继承或者转换对象指针的作用: 唯一不通的是前者参数是罗列出来的,后者是存到数组中 ...

  2. ES6面试 知识点汇总(全)

    近期在复习ES6,针对ES6新的知识点,以问答形式整理一个全面知识和问题汇总.(全干货,适合对ES6有一定理解的同学复习,以及ES6面试.) 一.问:ES6是什么? 答: ES6是新一代的JS语言标准 ...

  3. ES6 常用知识点总结

    ES6常用知识总结 之前总结了es5中js的一些知识点.这段时间看了石川blue老师讲解的es6课程,结合阮一峰老师的es6教程,随手做了一些笔记和总结分享给大家.内容还是es6主要的知识点,基本没有 ...

  4. ES6常用知识点小结

    ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准. 因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015(简称ES2015).虽然浏览器在不 ...

  5. es6 总结知识点

    1. let  和 const 只在代码块中有效  {}   js块级作用域. const 定义的对象是可以改变其属性的 const a =[], b={} ; a.push(1); b.a=1; / ...

  6. ES6常用知识点

    一.变量 var:定义的变量有时候会成为全局变量 let:定义的变量严格,只在代码块内有效 const:声明的变量是常量,不能被修改 二.数据类型 字符串 @定义:~字符串定义标记,支持换行.  #常 ...

  7. JavaScript易错知识点整理

    前言 本文是我学习JavaScript过程中收集与整理的一些易错知识点,将分别从变量作用域,类型比较,this指向,函数参数,闭包问题及对象拷贝与赋值这6个方面进行由浅入深的介绍和讲解,其中也涉及了一 ...

  8. JavaScript 易错知识点整理

    本文是我学习JavaScript过程中收集与整理的一些易错知识点,将分别从变量作用域,类型比较,this指向,函数参数,闭包问题及对象拷贝与赋值这6个方面进行由浅入深的介绍和讲解,其中也涉及了一些ES ...

  9. es6 module + webpack

    其实在之前本人就看了 es6 里面的一部分内容,当然是阮一峰大神的 ECMAScript 6 入门. 最近闲来无事又来看下,其中 Module 的语法 这章时候,用里面代码跑的时候,理所当然的报错 S ...

随机推荐

  1. asp.net core 2.1 部署IIS(win10/win7)

    asp.net core 2.1 部署IIS(win10/win7) 概述 与ASP.NET时代不同,ASP.NET Core不再是由IIS工作进程(w3wp.exe)托管,而是使用自托管Web服务器 ...

  2. jquery获取url的方式

    (function ($) { $.getUrlParam = function (name) { var reg = new RegExp("(^|&)" + name ...

  3. 如何利用MongoDB打造TOP榜小程序

    欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由腾讯云数据库 TencentDB发表于云+社区专栏 今天我分享的主题内容大概是两部分,最主要的还是小游戏和小程序,第一部分就是跟大家分 ...

  4. PGSQL-通过SQL语句来计算两个日期相差的天数

    这是本人第一次写的~我在某次需求中遇到一个问题,如何在SQL语句中计算出两个日期的天数,然后用那个结果来进行数据的筛选呢?通过网上查阅了资料发现 date_part('day', cast(time1 ...

  5. SQLServer之索引简介

    索引设计基础知识 索引是与表或视图关联的磁盘上结构,可以加快从表或视图中检索行的速度. 索引包含由表或视图中的一列或多列生成的键. 这些键存储在一个结构(B 树)中,使 SQL Server 可以快速 ...

  6. 英语口语练习系列-C07-谈女孩

    <将进酒>·李白 君不见黄河之水天上来,奔流到海不复回. 君不见高堂明镜悲白发,朝如青丝暮成雪. 人生得意须尽欢,莫使金樽空对月. 天生我材必有用,千金散尽还复来. 烹羊宰牛且为乐,会须一 ...

  7. Collections方法的使用

    public static void main(String[] args) { // 0.给List排序 List<Integer> list = new ArrayList<In ...

  8. 研究好vif 和vshow

    另外从源头上处理的???,怎么自己排查出错误??必须 ??https://www.jb51.net/article/124116.htm

  9. 专治编译器编辑器vscode中文乱码输出 win10 配置系统默认utf-8编码

    VS Code输出会出现乱码,很多人都遇到过.这是因为VS Code内部用的是utf-8编码,cmd/Powershell是gbk编码.直接编译,会把“你好”输出成“浣犲ソ”.如果把cmd的活动代码页 ...

  10. python3 Counter模块

    from collections import Counter c = Counter("周周周周都方法及")print(c)print(type(c))print('__iter ...