js
关注
分享
扫一扫
hkwBest
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
ES6--数组
写在前面： 我本前端小汪一枚，本着对前端知识的无比热爱的心情（其实最近比较闲~），工作之余整理了一些ES6的要点内容，特此分享与君共勉，会持续更新欢迎各路大神批评指正~今个儿头一天咱们来扯一扯数组的八卦： 对于前端的程序旺来说数组再熟悉不过了，不过最新的ES6规范中对数组进行了很多的扩展和改进，闲话不多说进入主题。/* Array.from()用于把类数组对象或可遍历的对象转化为真原创 2017-11-23 22:04:41 · 1895 阅读 · 0 评论 -
Vue--双向绑定
在React或者Vue这类MVVM框架中使用双向绑定是很常见的需求，最近项目中在使用Vue，今天来谈一谈Vue中双向绑定的实现。先来说几句废话：什么是双向绑定？把Model中的数据绑定到View中，然后更新Model时View会自动跟新，这叫单向绑定，而当用户改变View时Model中数据也能自动更新时，这叫双向绑定！如何实现Vue中的双向绑定？有两种方式可供参考：$emit 自定义事件处...原创 2019-05-30 16:17:13 · 560 阅读 · 0 评论 -
根据输入实时发送请求（防抖函数）
有这样一种常见的需求：有一个搜索框，需要根据用户的输入进行实时的查询。也就是说用户每输入一个字符就要发送一次请求。最先想到的做法是监听输入框的keyup时间然后在回调里发送异步请求。这样做的不足也很明显：其实我们并不需要用户每次输入时都发送请求，这样会给服务器造成不必要的压力。因为发送的是异步请求，有可能查询的结果和最后输入的内容并不匹配。如何解决以上两种问题呢？ 有两种解决...原创 2019-05-21 17:38:36 · 2533 阅读 · 2 评论 -
keydown、input、keyup
我们常常需要通过监听输入框的keydown、input、keyup、change、blur事件来操作输入内容，所以他们的差异就不得不了解。先来看一个实验案例：<body> <input id='user' type="text" /></body><script> var user = document.getElementById('...原创 2019-04-09 12:09:33 · 1695 阅读 · 0 评论 -
ES6的Module模块
设计思想ES6模块的设计思想是尽可能的静态化，使得编译时就能确定模块间的依赖关系。这也是与CommonJS和AMD运行时才能确定模块间的关系的主要区别。以CommonJS来说明一下运行时加载的原理。// CommonJS模块let { beef, wine, glass } require(material.js);//等价于let materials = require(mater...原创 2019-04-11 20:44:33 · 450 阅读 · 0 评论 -
Attribute和Prototype详解
最新有小伙伴问我Attribute和Prototype的区别，今总结如下：Attribute： 表述HTML标签的特性集合。Prototype： 表述DOM对象的属性，它属于Js里对象的范畴。举个栗子：<input id="test" placeholder="hello world" other="something" />var input = document.get...原创 2019-03-13 11:01:40 · 919 阅读 · 0 评论 -
instanceof和typeof 详解
判断变量是某种数据类型也是实际开发中常见的操作，总结如下：写在前面在介绍这两者之前先来回顾下js中的数据类型都有哪些。基础数据类型nullundefinedStringNumberBoolean引用数据类型Object、Array、Function、Date等typeoftypeof操作符返回一个字符串，我们先来看看使用typeof判断数据类型的结果typ...原创 2019-03-12 15:30:21 · 632 阅读 · 0 评论 -
重学原型链
一切源于一个简单的案例：function Foo(){ this.name = name; // 原始属性or方法}Foo.prototype.say = function(){ // 原型属性or方法 f}var f1 = new Foo();f1.say(); //helloFoo.prototype = {};var f2 = new Foo()...原创 2019-03-11 17:45:52 · 215 阅读 · 0 评论 -
输入银行卡，每4位加空格
前几天项目中用到这个，在网上查到一个很好的解决方案 特拿出来分享Dom<input type='tel' maxLength=25 class='bank' />js// 获取光标位置function getCursortPosition(textDom) { var cursorPos = 0; if (document.selection) { ...翻译 2019-01-28 18:26:03 · 1124 阅读 · 0 评论 -
可以使用break/continue跳出的循环
js中对数组、对象的遍历方法众多，但并不是每个方法都可以使用break/continue跳出循环，这些方法我们经常使用却也很容易混淆，特总结如下：直接看代码吧！！var arr = ['beijing', 'shanghai', 'guangzhou', 'shenzhen', 'hangzhou', 'chengdu'], obj = { name: 'tom', age: 20, addr...原创 2018-11-07 16:27:38 · 2095 阅读 · 0 评论 -
手写JSONP
jsonp在前端领域是个很常用的技术，面试中也可能会让你手写jsonp。相信很多同学都听过jsonp但对其实现原理并不是很清楚，今天咱们来一边手写jsonp一边介绍其原理。首先为什么会有jsonp这个技术呢？都是同源策略惹的祸。那什么又是同源策略呢？所谓同源是指，域名，协议，端口相同。举个简单的栗子，你在百度的站点通过ajax是访问不到新浪的页面的？那怎么解决这个问题呢，jsonp要闪亮登场了...原创 2018-08-07 16:53:02 · 1967 阅读 · 0 评论 -
操作数组之常用方法：map()、filter()、some()、every()、 forEach()
如标题所说这几个方法是操作数组最常用的几个方法。它们有怎样的区别呢？map(callback)返回一个新的数组。为每个元素执行callback方法let arr = [1,2,3,4];let newArr = arr.map((item,index)=>{return item*2}); //callback要有returnconsole.log(newArr); // [2...原创 2018-07-25 16:37:34 · 1741 阅读 · 0 评论 -
去掉字符串前后空格--trim
原生的js并没有提供像jQuery的trim方法，但是工作中又会经常用到，所以常常需要自己实现。去掉字符串前后的空格有很多种实现方式，正则无疑是最方便高效的一种，也是最常用的一种。原理也很简单。function Trim(){ String.prototype.trim = function(){ return this.replace(/(^\s*) | (\...原创 2018-07-25 14:55:00 · 5114 阅读 · 0 评论 -
一个简单的笛卡儿积分享
前两天工作中用到笛卡儿积，一时间没有思路，在网上找个一个很不错的方法特记录分享如下：function cartesianProductOf() { return Array.prototype.reduce.call( arguments, (total, currItem) =>{ var ret = []; ...翻译 2018-07-23 12:04:59 · 490 阅读 · 0 评论 -
理解this指向
this指向大致可以分为两种，一种是ES5中的this，另外一种是ES6中的this也就是箭头函数的this。 想要了解ES5中的this只要记住两点就可以了： this的指向在函数执行时才能确定， 而this指向 最近一次 调用的对象（不过也有几种特殊情况，后面会做说明。） 来看几个例子var n = 10;var obj = { n: 20, f...原创 2018-07-23 11:23:35 · 330 阅读 · 0 评论 -
javascript数组
js中的数组很基础，今天写下此文的原因是本人总是把slice和splice搞混，所以特此记下一笔，算是做个总结。 let arr = [1,2,3,4]常用方法 arr.push('5') //数组尾部添加元素 [1,2,3,4,5] arr.unshift('0') //数组头部添加元素 [0,1,2,3,4] arr.pop() //数组...原创 2018-03-08 10:47:35 · 385 阅读 · 0 评论 -
图片加载失败占位符
当网络不佳加载图片时会出现加载失败或者延时加载的情况，此时原本的图片位置会显示空白状态，这造成了不好的用户体验，所以我们需要加一个图片占位符。有两种方式可以实现：js其实这种方式也很简单，监听onerror事件就可以了。举个栗子：<img src="http://xxxx" onerror="{this.src='/statictest.png'}" />监听onerror...原创 2019-06-25 11:25:28 · 2086 阅读 · 0 评论