AS_TS的博客

HTML5 拖放 （Drag 和 Drop）W3Cschool----HTML5 拖放首先：为了把一个元素设置为可拖放，请把 draggable 属性设置为true然后，规定当元素被拖动时发生的事情。ondragstart 属性调用了一个 drag(event)函数，规定拖动什么数据。dataTransfer.setData() 方法设置被拖动数据的数据类型和值ondragover 事件规定被拖动的数据能够被放置到何处。默认地，数据/元素无法被放置到其他元素中。为了实现拖放，我们必须阻止元素的这种

Number.prototype.toLocaleString()toLocaleString() 方法返回这个数字在特定语言环境下的表示字符串。新的 locales 和 options 参数让应用程序可以指定要进行格式转换的语言，并且定制函数的行为。在旧的实现中，会忽略 locales 和 options 参数，使用的语言环境和返回的字符串的形式完全取决于实现方式。语法格式：numObj.toLocaleString(locales, options:{})locales 可选。缩写语言代码，

ReflectReflect 是一个内置的对象，它提供拦截 JavaScript 操作的方法。这些方法与proxy handlers的方法相同。Reflect不是一个函数对象，因此它是不可构造的。描述与大多数全局对象不同Reflect并非一个构造函数，所以不能通过new运算符对其进行调用，或者将Reflect对象作为一个函数来调用。Reflect的所有属性和方法都是静态的（就像Math对象）。Reflect 对象提供了以下静态方法，这些方法与proxy handler methods的命名相同.其

Proxy 对象响应代理器，可以监视到对象的读写过程const personProxy = new Proxy(person, {}第一个参数(person)是需要代理监听的对象，第二个参数为代理的处理对象，通过 get(){} 方法监听属性的读取访问， 通过 set(){} 方法监听对象中设置属性的过程get (target, property) {}第一个参数(target)是代理目标对象，第二个参数(property)是外部访问目标对象的属性名，返回值会成为外部访问该属性的返回

参数默认值// 默认参数一定是在形参列表的最后function foo (enable = true) { console.log('foo invoked - enable: ') console.log(enable)}foo(false)注意：默认参数一定是在形参列表的最后剩余参数// 原始方式使用 'arguments'// function foo () {// console.log(arguments)// }function foo (first,

模板字符串反引号包裹允许换行可以通过 ${} 插入表达式，表达式的执行结果将会输出到对应位置const msg = `hey, ${name} --- ${1 + 2} ---- ${Math.random()}`console.log(msg)带标签的模板字符串模板字符串的标签就是一个特殊的函数， 使用这个标签就是调用这个函数const name = 'tom'const gender = falsefunction myTagFunc (strings, name, gen

es6 数组结构原始取值方式const arr = [100, 200, 300] const foo = arr[0] const bar = arr[1] const baz = arr[2] console.log(foo, bar, baz)结构方式const arr = [100, 200, 300]// 依次对应 const [foo, bar, baz] = arr console.log(foo, bar, baz)单独获取第三个，前两个位置用逗号’,'空出来

采用单线程模式工作的原因JavaScript 采用单线程工作模式，因为JavaScript 最开始是用来在浏览器运行的脚本语言，是用来实现页面的动态交互，实现动态交互的核心是 DOM 操作，所以只能使用单线程模型，否侧会出现复杂的线程同步问题。单线程是指，js 执行环境中负责执行代码的线程只有一个这种模式最大的优势就是更安全，更简单。缺点也很明确，就是如果中间有一个特别耗时的任务，其他的任务就要等待很长的时间，出现假死的情况。JavaScript 将任务执行模式分成两种，同步模式（Synchron

promise就是一个类在执行类的时候需要传递一个执行器进去，执行器会立即执行Promise中有三种状态，分别为成功-fulfilled 失败-rejected 等待-pendingpending -> fulfilledpending -> rejected一旦状态确定就不可更改resolve 和 reject函数是用来更改状态的resolve：fulfilledreject：rejectedthen方法内部做的事情就是判断状态如果状态是成功，调用成功回调函数如果状态..

什么是函数式编程函数式编程(Functional Programming, FP)，FP 是编程范式之一，我们常听说的编程范式还有面向过程编程、面向对象编程。面向对象编程的思维方式：把现实世界中的事物抽象成程序世界中的类和对象，通过封装、继承和多态来演示事物事件的联系函数式编程的思维方式：把现实世界的事物和事物之间的联系抽象到程序世界（对运算过程进行抽象）程序的本质：根据输入通过某种运算获得相应的输出，程序开发过程中会涉及很多有输入和输出的函数x -> f(联系、映射) -&gt

纯函数和柯里化很容易写出洋葱代码 h(g(f(x)))函数组合可以让我们把细粒度的函数重新组合生成一个新的函数函数组合函数组合 (compose)：如果一个函数要经过多个函数处理才能得到最终值，这个时候可以把中间过程的函数合并成一个函数函数就像是数据的管道，函数组合就是把这些管道连接起来，让数据穿过多个管道形成最终结果函数组合默认是从右到左执行fn = compose(f1, f2, f3)b = fn(a)// 组合函数function compose (f, g) {

柯里化 (Haskell Brooks Curry)使用柯里化解决硬编码的问题案例：function checkAge (age) { let min = 18 return age >= min}// 普通纯函数function checkAge (min, age) { return age >= min}checkAge(18, 24)checkAge(18, 20)checkAge(20, 30)// 柯里化function checkAge (mi

纯函数纯函数概念纯函数：相同的输入永远会得到相同的输出，而且没有任何可观察的副作用纯函数就类似数学中的函数(用来描述输入和输出之间的关系)，y = f(x)lodash 是一个纯函数的功能库，提供了对数组、数字、对象、字符串、函数等操作的一些方法数组的 slice 和 splice 分别是：纯函数和不纯的函数slice 返回数组中的指定部分，不会改变原数组splice 对数组进行操作返回该数组，会改变原数组数式编程不会保留计算中间的结果，所以变量是不可变的（无状态的

高阶函数什么是高阶函数高阶函数 (Higher-order function)可以把函数作为参数传递给另一个函数可以把函数作为另一个函数的返回结果函数作为参数模拟 forEach// forEach function forEach (array, fn) { for (let i = 0; i < array.length; i++) { fn(array[i]) } }let arr = [1, 3, 4, 7, 8]forEach(arr, fun

博客链接：一盏茶的时间，快速捕获JS中常用的方法（细心整理，持续更新ing）javascript篇–1.6万字带你回忆那些遗忘的JS知识点

HTML中的 & nbsp; & ensp; & emsp; 6种空格标记 &nbsp; 不会累加的（只算1个），且该空格占据宽度受【字体】影响明显而强烈 <button type="button">提&nbsp;&nbsp;&nbsp;&nbsp;交</button><br /> &ensp; 占据的宽度正好是1/2个中文宽度，且基本上不受字体

现有两组数据，A组是已有成员，B组是所有成员。现有需求，要将未添加到已有成员（A组）的成员过滤出来。A组：contentA = [ { id: 22f157cc, name: 张三 }, { id: a2ac623f, name: 李四 },]B组：allPersonB = [ { id: 22f157cc, name: 张三 }, { id: a2ac623f, name: 李四 }, { id: 52b02014, name: 王五 }, { id: cbfb10b6, name

1. url 传参一般跳转传递 id 都放入 url 中this.props.history.push(`/document-analysis/fans-list?id=${this.state.bloggerId}`)地址栏显示在跳转接收页 this.props.location 打印的路由参数2. state 传参跳转时需要带其他较多数据，无法在 url 上携带，可以使用 state 传值this.props.history.push({ pathname: `/document-a

document.location 这个对象包含了当前URL的信息 location.host 获取port号 location.hostname 设置或获取主机名称 location.href 设置或获取整个URL location.port设置或获取URL的端口号 location.search 设置或获document.location 这个对象包含了当前URL的信息location.host 获取port号location.hostname 设置或获取主机名称location.hre

这里提供一个小需求，需要将 examid 相同的项合并，并将此项中的 answer 属性值合起来且不重复具体数据如下：state = { arr: [ { examid: '1052', stb: '1', optionid: '4199', answer: 'A' }, { examid: '1265', stb: '1', optionid: '5051', answer: 'A' }, { examid: '97

reduce()方法可以搞定的东西，for循环，或者forEach方法有时候也可以搞定，那为啥要用reduce()？这个问题，之前我也想过，要说原因还真找不到，唯一能找到的是：通往成功的道路有很多，但是总有一条路是最捷径的，亦或许reduce()逼格更高…1、语法arr.reduce(callback,[initialValue])reduce 为数组中的每一个元素依次执行回调函数，不包括数组中被删除或从未被赋值的元素，接受四个参数：初始值（或者上一次回调函数的返回值），当前元素值，当前索引，调用

参考引用：数组里面对象去重的3种方法: https://blog.csdn.net/l284969634/article/details/91397332js数组去重的多种方法: https://blog.csdn.net/linglingzi001/article/details/107772411JS中reduce方法: https://blog.csdn.net/hope93/article/details/86528183Array.reduce()方法解析: https://blog.cs

前端的匹配方式有很多这里简单提供模糊匹配方式：使用 RegExp 函数 正则表达式来进行匹配正则表达式var list = ['nai','43q','5xn']var keyWord = 'n'var arr = []var reg = new RegExp(keyWord)for(var i = 0; i < list.length; i++) { if(list[i].match(reg)) { arr.push(list[i]); }}return arr;

class App extends React.Component<connectedProps & RouteComponentProps> { public state = { form: { param: '', }, // 监听输入框 public changeInput = (e: any) => { // console.log(e.target, 'input'); const value = e.targe

JavaScript数组去重（12种方法，史上最全）javascript发布于 2018-09-16数组去重，一般都是在面试的时候才会碰到，一般是要求手写数组去重方法的代码。如果是被提问到，数组去重的方法有哪些？你能答出其中的10种，面试官很有可能对你刮目相看。在真实的项目中碰到的数组去重，一般都是后台去处理，很少让前端处理数组去重。虽然日常项目用到的概率比较低，但还是需要了解一下，以防面试的时候可能回被问到。注：写的匆忙，加上这几天有点忙，还没有非常认真核对过，不过思路是没有问题，可能一些小细节

转换成时间戳// 转换成时间戳export function timeStamp(time: any) { return new Date(time).getTime()}可以转换的日期格式为:1. “2018/1/1 8:00:00”;2. “2018,1,1 8:00:00”;3. “2018-1-1 8:00:00”; - 中间不能有空格，如果有空格需要过滤掉4. “2019-01-08T00:51:02.000+0000” ;其中年份为必填，其余的都可以省略，月/日不