梦见阳光。。-CSDN博客

原创 ES7学习

ES7新增语法1.includes2.指数运算：**2**3 // Math.power(2,3)ES8新增语法1.Async/Await:更加语义化(以前操作异步代码方式：1、嵌套回调 2.Promise 3.Generators)async function add(num) { //该函数返回一个promise return num + 2}add(2).then(res => { console.log(res) // 3}await语法function

2020-05-28 23:03:40 170

原创 js的变量提升，函数提升和执行上下文理解

js变量提升与函数提升的机制js执行上下文第一篇文章中可以看例子，但解释有点不太对，从第二篇文章可以看出应该是函数和变量都提升时，函数提升的优先级大于变量提升的优先级，函数的处理会在变量的前面，在变量进行AO(activation object)的时候，VO已经存在了，只不过如果存在同名属性，就会继续向下扫描，所以在解释阶段依旧是函数，不会是变量，在执行阶段，才会变成变量。...

2020-05-08 09:28:22 227

原创 JavaScript块级作用域的变量声明和函数声明

最近在一个讨论群看到一个面试题：{ a = 10; function a(){}; console.log(a)//10};console.log(a);//10what？不应该是：function a(){} 、function a(){} 吗？最后一位牛人给出了他的理解，这里本人只是作出验证，加深理解。环境默认都是chrome环境，支持ES6。下文提出的默认变量指的...

2020-04-27 11:31:23 1190 3

原创扁平化数组

/*已知如下数组：var arr = [ [1, 2, 2], [3, 4, 5, 5], [6, 7, 8, 9, [11, 12, [12, 13, [14] ] ] ], 10];编写一个程序将数组扁平化去并除其中重复部分数据，最终得到一个升序且不重复的数组*/function flatArray(arr, re=[]) { for (const item of arr) {...

2019-11-13 08:43:08 167

原创同步和异步

/*事件循环是通过任务队列的机制来进行协调的。一个 Event Loop 中，可以有一个或者多个任务队列(task queue)，一个任务队列便是一系列有序任务(task)的集合；每个任务都有一个任务源(task source)，源自同一个任务源的 task 必须放到同一个任务队列，从不同源来的则被添加到不同队列。 setTimeout/Promise等API便是任务源，而进入任务队列的是他...

2019-11-13 08:42:10 80

原创深度优先遍历和广度优先遍历

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>deepTraversal</title></head><body> <div class="parent"> <...

2019-08-09 09:01:23 82

原创节流函数

//节流函数：如果持续触发事件，每隔一段时间，只执行一次事件，时间戳和定时器两种方式实现 //1.用时间戳实现：第一次调用时间戳，减去上次的时间戳，当大于wait,则执行函数，并更新上次时间戳，如果 // 小于，则不执行 // 第一次调用能立即执行，但是结束调用不能执行最后一次 function throttleWithDate(func, wait = 1000) { ...

2019-08-05 09:01:45 193

原创防抖函数

//1.延时执行的防抖函数: 在延时范围内只执行一次，且不是立即执行，只会执行延时范围内最后调用的那一次 function debounce(func, delay = 5) { let timer = null; return function (args) { console.log('timer:', timer); clearTimeo...

2019-07-23 08:58:56 740

原创 onclick和addEventListener的区别

let btn = document.getElementById(‘testButton’);btn.onclick = () => { console.log('第一次调用onclick');};btn.onclick = () => { console.log('第二次调用onclick');};//输出：第二次调用onclick// btn.onclic...

2019-07-22 11:31:12 208

原创理解闭包和立即执行函数

//理解闭包和立即执行函数//1.闭包function count() { var i = 0; i++; console.log(i);}i = 5;count(); //1var c1 = count; //变量i在函数调用完一次就被销毁c1(); //1c1(); //1//如何实现一个简单的计时器，采用闭包function count2() { ...

2019-07-16 08:16:27 147

原创 Get Url Query Params

//查询URL中的参数function getUrlQueryParams(url) { let args={}; if (!url) { return args; } let qs = url.split('?'); if (qs.length < 2) { return args; } let items = qs[1].split('&...

2019-06-14 09:03:23 438

原创浏览器输入url发生了什么

1.解析URL关于URL：URL（Universal Resource Locator）：统一资源定位符。俗称网页地址或者网址。URL用来表示某个资源的地址。（通过俗称就能看出来）URL主要由以下几个部分组成：a.传输协议b.服务器c.域名d.端口e.虚拟目录f.文件名g.锚h.参数也就是说，通常一个URL是像下面这样连起来就是：http://www.aspxfan...

2019-05-31 14:32:36 106

原创 Valid Parentheses

// Given a string containing just the characters ‘(’, ‘)’, ‘{’, ‘}’, ‘[’ and ‘]’, determine if the input string is valid.//// An input string is valid if://// Open brackets must be closed by t...

2019-05-27 09:03:15 66

原创 Remove Duplicates From Sorted Array

// Given a sorted array nums, remove the duplicates in-place such that each element appear only once and return the new length.//// Do not allocate extra space for another array, you must do this by...

2019-05-27 09:00:29 64

原创 React性能优化

1.render里面尽量减少新建变量和bind函数，传递参数是尽量减少传递参数的数量。首先我们先思考一个问题，比如我要实现一个点击按钮使相应的num增加1，我们有哪一些方法。大家应该都能想到，无非就是三种，如下图：第一种是在构造函数中绑定this，第二种是在render()函数里面绑定this，第三种就是使用箭头函数，都能实现上述方法；但是哪一种方法的性能最好，是我们要考虑的问题。应该大...

2019-05-21 09:24:02 96

原创 React生命周期

生命周期函数指在某一时刻组件自动执行的函数。2.mount挂载componentWillMount – render – componentDidMount组件即将被挂载到页面上–挂载–组件被挂载到页面上之后执行componentWillMount， componentDidMount只会在第一次的时候执行3.update更新组件更新有两种情况1.props发生变化2.state...

2019-05-21 09:04:34 122

原创 Valid Parentheses

// Given a string containing just the characters '(', ')', '{', '}', '[' and ']', determine //if the input string is valid.// An input string is valid if:// Open brackets must be closed by the sam...

2019-05-21 08:52:28 59

原创 Longest Common Prefix

// Given a string containing just the characters ‘(’, ‘)’, ‘{’, ‘}’, ‘[’ and ‘]’, determine if the input string is valid.// An input string is valid if:// Open brackets must be closed by the same ty...

2019-05-21 08:51:09 71

原创 Palindrome Number

// Determine whether an integer is a palindrome. An integer is a palindrome when it reads the same backward as forward.//// Example 1://// Input: 121// Output: true// Example 2://// Input: -...

2019-05-17 08:59:01 92

原创 React中的虚拟DOM

假想React底层实现1.state数据2.jsx模板3.数据 + 模板结合，生成真实的dom，来显示4.state发生改变5.数据 + 模板结合，生成真实的dom，替换原始的dom、缺陷：第一次生成了一个完整的dom片段第二次又生成了一个完整的dom片段第二次的dom替换第一次的dom非常耗性能第二种假想1.state数据2.jsx模板3.数据+模板结合，生成真实的...

2019-05-17 08:56:18 81

原创 Roma To Integer

// Determine whether an integer is a palindrome. An integer is a palindrome when it reads the same backward as forward.//// Example 1://// Input: 121// Output: true// Example 2://// Input: -...

2019-05-16 09:01:25 117

原创 Reverse Number

/** * @param {number} x * @return {number} */var reverse = function(x) { let str = x < 0 ? -x : x; str = str.toString(); str = parseInt(str.split('').reverse().join('')); x = x < 0 ?...

2019-05-16 08:59:54 283

原创 Two Sum

// Given an array of integers, return indices of the two numbers such that they add up to a specific target.//// You may assume that each input would have exactly one solution, and you may not use...

2019-05-16 08:58:47 49

原创 ES6学习：第十九章 Module

//第十九章 Module//模块功能主要由两个命令构成：export和import。export命令用于规定模块的对外接口，import命令用于输入其// 他模块提供的功能。//export：一个模块就是一个独立的文件。该文件内部的所有变量，外部无法获取。如果你希望外部能够读取模块内部// 的某个变量，就必须使用export关键字输出该变量。//写法一：export let a ...

2019-02-25 22:59:19 80

原创 ES6学习：第十八章类

//第十八章类//类的基本语法class fruit { constructor(name, color) { this.name = name; this.color = color; } get firstName(){ console.log('get'); return this.name[0];...

2019-02-25 22:21:16 82

原创 ES6学习：第十七章 Generator 函数

//第十七章 Generator 函数的语法//调用 Generator 函数，返回一个遍历器对象，代表 Generator 函数的内部指针。以后，每次调用遍历器对象的// next方法，就会返回一个有着value和done两个属性的对象。value属性表示当前的内部状态的值，是yield表达// 式后面那个表达式的值；done属性是一个布尔值，表示是否遍历结束。//Generator ...

2019-02-25 17:06:40 93

原创 ES6学习：第十六章 Iterator 和 for...of 循环

//第十六章 Iterator 和 for...of 循环//JavaScript 原有的表示“集合”的数据结构，主要是数组（Array）和对象（Object），ES6 又添加了Map和Set。//任何数据结构只要部署 Iterator 接口，就可以完成遍历操作,一种数据结构只要部署了 Iterator 接口，我们就// 称这种数据结构是“可遍历的”//原生具备 Iterator 接口的...

2019-02-25 10:25:18 83

原创 ES6学习：第十五章 Promise对象

//第十五章 Promise对象//Promise是一个对象，可以获取异步操作的消息//Promise构造函数接受一个函数作为参数，该函数的两个参数分别是resolve和reject。//resolve函数的作用是，将Promise对象的状态从“未完成”变为“成功”//reject函数的作用是，将Promise对象的状态从“未完成”变为“失败”//Promise实例生成以后，可以用the...

2019-02-24 21:02:28 92

原创 ES6学习：第十四章 Reflect

//第十四章 Reflect//Reflect对象引入目的：// 1.原本属于Object对象内部方法一些方法放到Reflect上，如Object.defineProperty// 2.修改某些object对象的返回结果，Object.defineProperty(obj, name, desc)在无法定义属性时，会抛出// 一个错误，而Reflect.defineProperty(...

2019-02-24 18:00:13 99

原创 ES6学习：第十三章 Proxy

//第十三章 Proxy//在目标对象之前架设一层“拦截”，外界对该对象的访问，都必须先通过这层拦截，因此提供了一种机制，可以对外界// 的访问进行过滤// Proxy语法：let proxy = new Proxy(target, handler)// new Proxy()表示生成一个Proxy实例，target参数表示所要拦截的目标对象，handler参数也是一...

2019-02-23 21:35:37 151

原创 Vue学习：第六章插槽、自定义指令

&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;插槽、自定义指令&lt;/title&a

2019-02-23 15:53:38 165

原创 Vue学习：第五章组件

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>组件</title> <script src="../node_modules/vue/dist/vue.js&qu

2019-02-22 18:35:04 86

原创 Vue学习：第四章 Class与Style绑定

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Class与Style绑定</title> <script src="../node_modules/vue/dis

2019-02-21 22:50:50 88

原创 Vue学习：第三章计算属性和侦听器

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>计算属性和侦听器</title> <script src="../node_modules/vue/dist/vue

2019-02-21 22:11:52 93

原创 Vue学习：第二章模板语法

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>模板语法</title> <script src="../node_modules/vue/dist/vue.js&

2019-02-21 21:30:11 96

原创 Vue学习：第一章 Vue实例之Vue生命周期

&amp;lt;!DOCTYPE html&amp;gt;&amp;lt;html lang=&quot;en&quot;&amp;gt;&amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&amp;gt; &amp;

2019-02-21 13:17:30 126

原创 Vue学习：第一章 Vue实例

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue实例</title> <script src="../node_modules/vue/dist/vue.js

2019-02-21 13:16:19 103

原创 ES6学习：第十二章 Set和Map数据结构

//第十二章 Set和Map数据结构//Set:类似数组，不包含重复的值const s = new Set('a'); //可以接受一个具有iterable接口的数据结构作为参数s.add('hello');console.log(s); //Set { 'a', 'hello' }let a = [1,2,3,6,1,2];console.log([...new Set(a)...

2019-01-23 16:53:46 79

原创 ES6学习：第十一章 Symbol

//第十一章 Symbol//ES6引入的一种新的原始数据类型，表示独一无二的值，为了防止对象的属性名冲突//JS七大数据类型：Undefined,Null,Boolean,Number,String,Object,Symbol(前五种为基本数据类型)let s = Symbol(); //不能使用new命令let s2 = Symbol('s2'); //可以传入一个描述符作为参数，用作...

2019-01-22 17:48:25 139

原创 JS闭包学习

//闭包：闭包是指有权访问另一个作用域的变量的函数，常见方式是在一个函数内部创建另一个函数function f() { let re = []; for (var i = 0; i &amp;amp;lt; 10; i ++){ re[i] = function () { return i; } } return re;...

2019-01-22 14:14:12 69

空空如也

空空如也