- 博客(49)
- 收藏
- 关注
RSS订阅转载 VueJS中学习使用Vuex详解（https://segmentfault.com/a/1190000015782272）
SPA单页面组件的开发中 Vue的vuex和React的Redux 都统称为同一状态管理，个人的理解是全局状态管理更合适；简单的理解就是你在state中定义了一个数据之后，你可以在所在项目中的任何一个组件里进行获取、进行修改，并且你的修改可以得到全局的响应变更。下面咱们一步一步地剖析下vuex的使用:首先要安装、使用 vuex首先在 vue 2.0+ 你的vue-cli项目中安装 vue...
2019-03-25 16:51:00
193
转载 Vue中的缩写，v-bind v-on
v-bind缩写：:预期：any (with argument) | Object (without argument)参数：attrOrProp (optional)修饰符： .prop - 被用于绑定 DOM 属性。.camel - (2.1.0+) 将 kebab-case 特性名转换为 camelCase..sync (2.3.0+) 语法糖，会扩展成一个更新父组件绑定值的 v-...
2019-03-25 16:44:00
293
转载 es6~Map数据结构
Map含义和基本用法JavaScript 的对象（Object），本质上是键值对的集合（Hash 结构），但是传统上只能用字符串当作键。这给它的使用带来了很大的限制。const data = {};const element = document.getElementById('myDiv');data[element] = 'metadata';data...
2019-03-07 10:04:00
153
转载 es6~Set函数
Set基本用法ES6 提供了新的数据结构 Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。Set本身是一个构造函数，用来生成 Set 数据结构。const s = new Set();[2, 3, 5, 4, 5, 2, 2].forEach(x => s.add(x));for (let i of s) { console.l...
2019-03-06 15:08:00
207
转载 Symbol（js的第七种数据类型）
概述ES5 的对象属性名都是字符串，这容易造成属性名的冲突。比如，你使用了一个他人提供的对象，但又想为这个对象添加新的方法（mixin 模式），新方法的名字就有可能与现有方法产生冲突。如果有一种机制，保证每个属性的名字都是独一无二的就好了，这样就从根本上防止属性名的冲突。这就是 ES6 引入Symbol的原因。ES6 引入了一种新的原始数据类型Symbol，表示独一无二的值。它是...
2019-02-25 18:10:00
98
转载 Object.fromEntries()
Object.fromEntries()Object.fromEntries()方法是Object.entries()的逆操作，用于将一个键值对数组转为对象。Object.fromEntries([ ['foo', 'bar'], ['baz', 42]])// { foo: "bar", baz: 42 }该方法的主要目的，是将键值对的数据...
2019-02-25 17:38:00
715
转载 Object.keys()，Object.values()，Object.entries()
Object.keys()，Object.values()，Object.entries()Object.keys()ES5 引入了Object.keys方法，返回一个数组，成员是参数对象自身的（不含继承的）所有可遍历（enumerable）属性的键名。var obj = { foo: 'bar', baz: 42 };Object.keys(obj)// ["f...
2019-02-25 17:37:00
106
转载 Object.getOwnPropertyDescriptors()
Object.getOwnPropertyDescriptors()ES5 的Object.getOwnPropertyDescriptor()方法会返回某个对象属性的描述对象（descriptor）。ES2017 引入了Object.getOwnPropertyDescriptors()方法，返回指定对象所有自身属性（非继承属性）的描述对象。const obj = { ...
2019-02-25 17:31:00
192
转载 es6~Object.assign()
Object.assign()基本用法Object.assign方法用于对象的合并，将源对象（source）的所有可枚举属性，复制到目标对象（target）。const target = { a: 1 };const source1 = { b: 2 };const source2 = { c: 3 };Object.assign(target, so...
2019-02-25 17:08:00
45
转载 es6~Object.is()
Object.is()ES5 比较两个值是否相等，只有两个运算符：相等运算符（==）和严格相等运算符（===）。它们都有缺点，前者会自动转换数据类型，后者的NaN不等于自身，以及+0等于-0。JavaScript 缺乏一种运算，在所有环境中，只要两个值是一样的，它们就应该相等。ES6 提出“Same-value equality”（同值相等）算法，用来解决这个问题。Object....
2019-02-25 14:53:00
58
转载 es6~扩展运算符后续
对象的扩展运算符扩展运算符（...）。ES2018 将这个运算符引入了对象。解构赋值对象的解构赋值用于从一个对象取值，相当于将目标对象自身的所有可遍历的（enumerable）、但尚未被读取的属性，分配到指定的对象上面。所有的键和它们的值，都会拷贝到新对象上面。let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 };x // 1...
2019-02-25 14:45:00
73
转载 es6~super关键字
super 关键字我们知道，this关键字总是指向函数所在的当前对象，ES6 又新增了另一个类似的关键字super，指向当前对象的原型对象。const proto = { foo: 'hello'};const obj = { foo: 'world', find() { return super.foo; }};Ob...
2019-02-25 11:37:00
69
转载 es6~属性的简洁表示法
属性的简洁表示法ES6 允许直接写入变量和函数，作为对象的属性和方法。这样的书写更加简洁。const foo = 'bar';const baz = {foo};baz // {foo: "bar"}// 等同于const baz = {foo: foo};上面代码表明，ES6 允许在对象之中，直接写变量。这时，属性名为变量名, 属性值为变量...
2019-02-25 09:33:00
218
转载 es6~find();findIndex()
数组实例的 find() 和 findIndex()数组实例的find方法，用于找出第一个符合条件的数组成员。它的参数是一个回调函数，所有数组成员依次执行该回调函数，直到找出第一个返回值为true的成员，然后返回该成员。如果没有符合条件的成员，则返回undefined。[1, 4, -5, 10].find((n) => n < 0)// -5上...
2019-02-20 10:27:00
88
转载 es6~copyWithin()
数组实例的 copyWithin()数组实例的copyWithin方法，在当前数组内部，将指定位置的成员复制到其他位置（会覆盖原有成员），然后返回当前数组。也就是说，使用这个方法，会修改当前数组。Array.prototype.copyWithin(target, start = 0, end = this.length)它接受三个参数。target（必...
2019-02-20 09:52:00
156
转载 es6~Array.of()
Array.of()Array.of方法用于将一组值，转换为数组。Array.of(3, 11, 8)//[3, 11, 8]Array.of(3)//[3]Array.of(3).length//1这个方法的主要目的，是弥补数组构造函数Array()的不足。因为参数个数的不同，会导致Array()的行为有差异。Array() // []Array...
2019-02-19 17:03:00
102
转载 es6~Array.from()
Array.from()Array.from方法用于将两类对象转为真正的数组：类似数组的对象（array-like object）和可遍历（iterable）的对象（包括 ES6 新增的数据结构 Set 和 Map）。下面是一个类似数组的对象，Array.from将它转为真正的数组。let arrayLike = { '0': 'a', '1': 'b...
2019-02-19 15:29:00
66
转载 es6~扩展运算符
扩展运算符含义扩展运算符（spread）是三个点（...）。它好比 rest 参数的逆运算，将一个数组转为用逗号分隔的参数序列。console.log(...[1, 2, 3])//1 2 3console.log(1, ...[2, 3, 4], 5)//1 2 3 4 5[...document.querySelectorAll('div')...
2019-02-19 11:42:00
141
转载 知识汇总14~js中call,apply,bind方法的使用
bind 是返回对应函数，便于稍后调用；apply 、call 则是立即调用 。apply、call在 javascript 中，call 和 apply 都是为了改变某个函数运行时的上下文（context）而存在的，换句话说，就是为了改变函数体内部 this 的指向。JavaScript 的一大特点是，函数存在「定义时上下文」和「运行时上下文」以及「上下文是可以改变的」这样的概...
2019-02-18 17:54:00
91
转载 es6~函数的扩展
函数参数的默认值基本用法ES6 之前，不能直接为函数的参数指定默认值，只能采用变通的方法。function log(x, y) { y = y || 'World'; console.log(x, y);}log('Hello') // Hello Worldlog('Hello', 'China') // Hello Chinalog('...
2019-02-18 17:34:00
56
转载 es6~数值的扩展
二进制和八进制表示法ES6 提供了二进制和八进制数值的新的写法，分别用前缀0b（或0B）和0o（或0O）表示。0b111110111 === 503 // true0o767 === 503 // true从 ES5 开始，在严格模式之中，八进制就不再允许使用前缀0表示，ES6 进一步明确，要使用前缀0o表示。// 非严格模式(function(...
2019-02-18 09:26:00
91
转载 es6~字符串的扩展
ES6 加强了对 Unicode 的支持，并且扩展了字符串对象。字符的 Unicode 表示法JavaScript 允许采用\uxxxx形式表示一个字符，其中xxxx表示字符的 Unicode 码点。"\u0061"// "a"但是，这种表示法只限于码点在\u0000~\uFFFF之间的字符。超出这个范围的字符，必须用两个双字节的形式表示。"\u...
2019-02-15 11:31:00
67
转载 es6~解构赋值
ES6允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构以前，为变量赋值，只能直接指定值。let a = 1;let b = 2;let c = 3;ES6 允许写成下面这样。let [a, b, c] = [1, 2, 3];上面代码表示，可以从数组中提取值，按照对应位置，对变量赋值。本质上，这种写法属于“模...
2019-02-14 16:27:00
765
转载 es6~顶层对象
ES6 声明变量的六种方法ES5 只有两种声明变量的方法：var命令和function命令。ES6 除了添加let和const命令，后面章节还会提到，另外两种声明变量的方法：import命令和class命令。所以，ES6 一共有 6 种声明变量的方法。顶层对象的属性顶层对象，在浏览器环境指的是window对象，在 Node 指的是global对象。ES5 之中，顶层对象的属性...
2019-02-13 18:04:00
156
转载 es6~const
基本用法const声明一个只读的常量。一旦声明，常量的值就不能改变。const PI = 3.1415;PI // 3.1415PI = 3;// TypeError: Assignment to constant variable.上面代码表明改变常量的值会报错。const声明的变量不得改变值，这意味着，const一旦声明变量，就必须立即初...
2019-02-13 17:54:00
86
转载 es6~块级作用域
块级作用域为什么需要块级作用域？ES5 只有全局作用域和函数作用域，没有块级作用域，这带来很多不合理的场景。第一种场景，内层变量可能会覆盖外层变量。var tmp = new Date();function f() { console.log(tmp); if (false) { var tmp = 'hello world'; }...
2019-02-13 16:44:00
57
转载 es6~let的使用
let 命令基本用法ES6 新增了let命令，用来声明变量。它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。{ let a = 10; var b = 1;}a // ReferenceError: a is not defined.b // 1上面代码在代码块之中，分别用let和var声明了两个变量。然...
2019-02-13 16:40:00
54
转载 ES6~Promise原理及使用三 搞懂jquery中的Promise(摘取自：https://www.cnblogs.com/lvdabao/p/jquery-deferred.html)...
前两篇我们讲了ES6中的Promise以及Promise/A+规范，在Promise的知识体系中，jquery当然是必不可少的一环，所以本篇就来讲讲jquery中的Promise，也就是我们所知道的Deferred对象。事实上，在此之前网上有很多文章在讲jquery Deferred对象了，但是总喜欢把ajax和Deferred混在一起讲，容易把人搞混。when、done、pr...
2019-02-11 17:40:00
122
转载 ES6~Promise的原理及使用二 理解Promise规范（copy自：https://www.cnblogs.com/lvdabao/p/5320705.html?utm_source=tuico...
上一篇我们讲解了ES6中Promise的用法，但是知道了用法还远远不够，作为一名专业的前端工程师，还必须通晓原理。所以，为了补全我们关于Promise的知识树，有必要理解Promise/A+规范，理解了它你才能知道Promise内部是怎么回事，我们ES6中的Promise是如何一路走来的。网上关于Promise/A+的翻译文档很多，所以我就不翻译一次了，本篇的目的在于为文档增加...
2019-02-11 17:37:00
116
转载 ES6~Promise的原理及使用一（copy自： https://www.cnblogs.com/lvdabao/p/jquery-deferred.html）...
去年6月份， ES2015正式发布（也就是ES6，ES6是它的乳名），其中Promise被列为正式规范。作为ES6中最重要的特性之一，我们有必要掌握并理解透彻。本文将由浅到深，讲解Promise的基本概念与使用方法。ES6 Promise 先拉出来遛遛复杂的概念先不讲，我们先简单粗暴地把Promise用一下，有个直观感受。那么第一个问题来了，Promise是什么玩意呢？...
2019-02-11 17:26:00
119
转载 react~setState的运行机制
1. setState基本特点1. setState是同步执行的 setState是同步执行的，但是state并不一定会同步更新2. setState在React生命周期和合成事件中批量覆盖执行 在React的生命周期钩子和合成事件中，多次执行setState，会批量执行具体表现为，多次同步执行的setState，会进行合并，类似于Object.assign，相同...
2019-02-11 15:45:00
410
转载 react ~4.组件table的使用及表格分页处理
antd里面表格数据分为三部分，columns:该对象数组用于设置表头数据，里面的dataIndex是对象数据里面对应的key， data:该对象数组用于设置每行的对应表头columns的数据， pagination:该对象用于设置分页columns: [{ title: '序号', dataIndex: 'in...
2019-01-31 17:54:00
765
转载 react ~3.动态无限层级顶部菜单和左边菜单设计制作
1.在整个项目制作之前，选择了antd作为react的组件库所以在做菜单时，选择了layout布局样式<Layout> <Header> <HeaderMenu headlist={this.state.headlist} user={this.props.userNam...
2019-01-31 16:50:00
877
转载 react ~2.登陆页面验证码的获取传递与刷新
import React from 'react';import { withRouter } from 'react-router-dom';import { Form, Input, Icon, Checkbox, Row, message } from 'antd';import { fetchPost, fetchGet } from '@common/js/...
2019-01-31 15:49:00
722
转载 react ~1.生命周期函数
componentWillMount:function(){}//组件挂载到节点之前执行componentDidMount:function(){}//节点被加载到指点节点之后执行componentWillUnmount:function(){}//组件被删除之前执行，可用于执行释放内存，和停定时器等componentWillUpdate//更新前componentDid...
2019-01-31 15:23:00
44
转载 知识汇总13~jquery模拟用户点击或获取焦点
在实际项目中，经常会遇到当用户打开某个页面时，让某个输入框自动获取 焦点，或者有其他需要提示用户的地方，都会用到。trigger()方法trigger()方法的意思自动触发被选元素的指定事件类型。trigger 可以传参数进去。eg：$('p').click( function (event, a, b) { // 一个普通的点击事件时，a和b是undefin...
2018-08-01 09:16:00
128
转载 知识汇总12~操作数组的方法
1、数组创建：var arr = new Array();var arr = new Array([size]);//创建并指定长度，但是长度是可以随之发生改变的2、数组的头部添加删除：unshift() 方法可向数组的开头添加一个或更多元素，并返回新的长度。shift() 方法用于把数组的第一个元素从其中删除，并返回第一个元素的值。3、数组的尾部添加删除：...
2018-07-31 10:51:00
57
转载 知识汇总11~vue中v-if使用时需要注意的点
v-if和v-else或v-else-if之间不能添加其他元素。 以下是错误事例<span v-if="type==1">错误示范</span><span>哈哈哈</span><p v-else>嘿嘿嘿</p>以下是正确实例&l...
2018-07-31 10:45:00
210
转载 知识汇总10~es6的map与set用法
js默认的对象表达方式是{}可以视为其他语言中的 Map 和 Dictionary 的数据结构;即一组键值对key - value;（键值对）js有个问题:对象表达方式{}中的键 key 必须是字符串,如下代码:var names={1:”a”,2:”b”};console.log(names.1)//Uncaught SyntaxError: missi...
2018-07-31 10:36:00
56
转载 知识汇总09~bootstrap-select在Vue中的封装
在项目中为何选择了bootstrap的bootstrap-select插件，因为相比其他下拉插件，这个插件更成熟，兼容性更好，也容易使用！如何在Vue中封装成组件：在项目中引入相应的bootstrap，与bootstrap-select的js与css1、js：组件封装 Vue.component('vm-select',{ props:['options'...
2018-07-30 17:51:00
410
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人