red_heel的博客

我们知道React Context 已经出现有一段时间了并且随着hook的盛行，我们更多的发掘出了Context的价值。Context是可以像Redux一样用来管理状态，不知道你有没有像我一样有这个疑问，那既然Redux就可以管理状态，为什么要使用Context呢？现在我的理解呢是由于Context API不像Redux那样依赖很多第三方库。但是并不是说Context就可以代替Redux的...

我有一个有趣的问题想问你，你最后一次使用原生DOM API创建你的真实的项目是什么时候了，是的，你也许也不记得是什么时候了。你知道的，我们可以利用DOM API来和HTML做任何交互。 但是现在我们可以使用当下流行的UI框架以及库来搭建我们的UI，例如React，VUE，Angular。所以在不使用框架来将我们的代码编译成为HTML/CSS/JS的情况下，你大部分还是要基于DOM AP...

除了用swipper等插件实现图片的切换之外，我们通过引入html5规范中的自定义data属性来实现图片切换。在详细介绍怎么实现切换之前，先介绍data属性的使用方法。<div class="dragon_eggs"> <img src="./img/dragon_egg1.png" alt="" id="dragon_eggImg" data-aw...

在说问题之前先附上一段代码： function addCourage(currentAddedCount){ if(currentAddedCount>0){ $('div.inner').find("div").addClass('inner-bar'); if(currentAddedCount<10){ $('div.inner')...

Chrome的autoplay政策在2018年4月做了更改。新的行为：浏览器为了提高用户体验，减少数据消耗，现在都在遵循autoplay政策，Chrome的autoplay 政策非常简单1. muted autoplay始终被允许2. 音乐的autoplay 只有在下面集中情况下起作用：    1. 有用户行为发生像（click,tap,etc）.    2. 对于桌面程序，用户已经提前播放了音频...

require与import区别

同步异步，promise,Async/await

 最近做一个本来只有三期活动的页面，后面伟大的需求说后面需求可能增加到n期，所以有一个以三期活动为一组的轮播，实现轮播的插件太多了，但是后端说不希望用插件，因为他那边可能要变动，所以就手动实现了一个简单的轮播效果 var length=$('.ul-nav li').length; var count=0; if(length>3){ $...

弄清楚webWorker,我们首先要弄清楚几个问题1. JavaScript为什么是单线程在前端JavaScript操作DOM树，其实通过调用浏览器API来操作DOM树的 ，如果JavaScript是多线程的，那意思就是我们可以一边对DOM树的同一节点既做增加的行为也可以做删除的操作，这岂不是乱套了。2. 为什么需要异步由于JavaScript是单线程的，所以当执行Javascri...

最近遇到一个小需求就是：当用户停留某个页面超过4个小时的时候，这个时候如果用户做任何交互行为，都给用户一个弹窗，提醒用户登陆超时需要重新登陆等信息。拿到这个需求的时候，心中窃喜，分析了一下，当用户与页面做交互的时候，比如发送请求的时候，后端会返回当sesstion timeout 的时候，返回给前端的某个标记sesstion timeout 的属性，我只需要判断这个标记信息，然后作出是否有...

最近在优化页面性能，项目中使用了jquery，但是我们项目主要将jquery用于发送ajax请求，所以决定去掉jquery，在去掉jquery的时候发现要用原生javascript 实现将html string 转化为node 节点的过程，查了资料发现一个之前从未接触过的方法，DOMParser,static parseElement(htmlString){ return new ...

1. 去重let a = [2, 3, 4, 5, 4]let a1 = [2, 3, 4, 5, 4]// method1 filter并不会改变原来数组let method1 = a.filter(function (value, index) { return a.indexOf(value) === index})console.log('方法-', method1)...

最近在看JavaScript看到了箭头函数，发现这个和C#中的 拉姆达表达式的用法差不多语法：1.let sum=(num1,num2)=>{num1+num2}2. let sum=()=>{num1+num2}自己小小demo中的代码var yammy=angular.module('Yammy',['ngRoute']);yammy.config(($routePro

原型是javascript继承机制，原型属性可以被用来给已经存在的构造函数添加方法。

ECMAScript数组提供了让数组像其他数据结构一样的表现形式例如像栈和队列一样。队列：先进先出，后进后出； pop()是删除末尾元素；shifft()是删除队首元素，unshift()是在队首位置添加元素。栈：先进后出，后进先出；     pop()是删除末尾元素；push()是添加元素到尾部。

众所周知，javascript是弱类型的编程语言，下面介绍集中创建对象实例的方法

虽然我们可以通过node.childNodes以及node.Children来访问元素node的子节点，但是node.childNodes与node.Children还是有些许不同

EventTarget.addEventListener()将指定的监听器注册到EventTarge,当该对象相应的事件被触发时，指定的事件将被触发。由来：之前一直给事件属性赋值，好奇为什么要用eventListenersvar button=document.getElementById("button");        button.onclick=dosomething1;

setInterval()方法重复调用一个函数或执行一个代码段，在每次调用之间具有固定的时间延迟。返回一个intervalID。语法：let intervalID=setInterval(func,delay[,param1,param2]);1. intervalID是此重复操作的唯一辩识符，可以作为参数传给clearInterval().2. func是你想要重复调用的函数。3

由于将scripttype="text/javascript"src="res/jquery-1.9.0.min.js">script>放在了结束标签后面，会出现Jquery不能加载的问题导致出现$ is not defined的问题。解决方式window.onload=function(){Jquery代码}即window.onload= functi

内置对象：由ECMAScript实现提供的、不依赖宿主环境的对象，这些对象在ECMAScript程序执行之前就已经存在了。开发人员不必显示的实例化内置对象，内置对象有：Object、Array和string.两个单体内置对象：Global和Math.Global对象不属于其他对象的属性和方法，最终都是它的属性和方法，所有定义在全局作用域下的变量和方法都是Global的属性和方法。ECMAS

初学javascript，遇到了javascript加载顺序问题

最近在做angularjs 的小小demo的时候遇到了下面的问题XMLHttpRequest cannot load file:///F:/Yammy/app/views/restaurants.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-exte

$rootScope.$apply()

一直搞不懂JavaScript、DOM以及Window的关系

请更新

ECMAScript的变量是松散类型的，所谓松散类型就是可以用来保存任何类型的数据。换句话说，每一个变量仅仅是一个用于保存值的占位符而已。

方法的定义，以及如何使用