
JavaScript相关
愿 不忘初心
梦想是注定孤独的旅行,与其苟延残喘,不如纵情燃烧
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
vue用Object.defineProperty手写一个简单的双向绑定的示例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>双向绑定</title> </head> <body> 手写一个简单双向绑定<br/> <input type="text" id="model"&...原创 2020-04-08 11:08:37 · 348 阅读 · 0 评论 -
JS原型链完整图(重点)
“ 一切皆对象 ”原创 2018-07-06 19:02:12 · 2096 阅读 · 0 评论 -
正则表达式
正则表达式MDN: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Regular_Expressions 史上最全的正则表达式 https://blog.csdn.net/qq_28633249/article/details/77686976 匹配中英文、字母和数字 https://www.cnblog...原创 2018-07-13 22:18:41 · 921 阅读 · 0 评论 -
冒泡排序数组以及按位异或(^)——看程序员认知
// for循环冒泡排序数组优化后 var arr = [10, 50, 70, 90, 20, 30]; for (var i = 0; i < arr.length - 1; i++) { var isOk = true; for (var j = 0; j < arr.length - 1 - i; j++) { ...原创 2018-07-27 19:14:11 · 1049 阅读 · 0 评论 -
ES6十大特性
ES6(ECMAScript2015)的出现,无疑给前端开发人员带来了新的惊喜,它包含了一些很棒的新特性,可以更加方便的实现很多复杂的操作,提高开发人员的效率。 本文主要针对ES6做一个简要介绍。 主要译自: http://webapplog.com/ES6/comment-page-1/。也许你还不知道ES6是什么, 实际上, 它是一种新的javascript规范。在这个大家都很忙碌的时代...转载 2018-08-06 10:13:25 · 201 阅读 · 0 评论 -
ES6中const var let区别
var 定义的变量可以修改,如果不初始化会输出 undefined,不会报错。 const 定义的变量不可以修改,而且必须初始化 let 是块级作用域,函数内部使用 let 定义后,对函数外部无影响。...原创 2018-08-02 17:41:44 · 170 阅读 · 0 评论 -
JQ常用方法汇总
目录 1、寻找元素 选择器 筛选器 2、属性操作 基本属性操作 CSS类 HTML代码/文本/值 3、CSS操作 样式 位置 尺寸 4、文档处理 内部插入 外部插入 替换 删除 复制 5、事件 页面载入 页面处理 页面委派 事件 (event object) 对象 6、效果 基本 滑动 淡入淡出 7、对象访问 8、插件拓展...翻译 2018-08-31 15:05:02 · 934 阅读 · 0 评论 -
JS制作实现一个图片懒加载插件
http://www.zyy1217.com/2017/03/20/js%E5%AE%9E%E7%8E%B0%E4%B8%80%E4%B8%AA%E5%9B%BE%E7%89%87%E6%87%92%E5%8A%A0%E8%BD%BD%E6%8F%92%E4%BB%B6/转载 2018-10-25 10:31:19 · 586 阅读 · 0 评论 -
数据的类型转换
显示转换 —— 转数字 —— Number() 如果转换的内容可以转成数字,那么就直接返回这个内容对应的数字 如果在内容中出现小数,那么小数会保留 如果是内容为空,那么转换成0 如果不可以转换那么返回NaN parseInt() 如果转换的内容可以转成数字,那么就直接返回这个内容对应的数字 如果不可以转换那么返回NaN 如果带有小数,那么会去掉小数,转成整数(向下取整) pars...原创 2018-10-26 13:45:05 · 226 阅读 · 0 评论 -
html页面使用canvas保存为图片
html2canvas 官方GitHub https://github.com/niklasvh/html2canvas Canvas2Image.js 第三方库 https://github.com/hongru/canvas2image 生成图片的清晰度取决于html转换成的canvas的清晰度: 将canvas的属性width和height属性放大为2倍(或者设置为devic...转载 2019-01-16 17:27:02 · 1666 阅读 · 0 评论 -
canvas画图,toDataURL方法封装
URI(Uniform Resource Identifier):统一资源标识符,服务器资源名被称为统一资源标识符 URL(Uniform Resource Locator):统一资源定位符,描述了一台特定服务器上某资源的特定位置 function getBase64(url, callback) { //通过构造函数来创建的 img 实例,在赋予 src ...原创 2019-01-22 16:16:39 · 4405 阅读 · 1 评论 -
javaScript遍历对象、数组总结
javaScript遍历对象总结 1、使用Object.keys()遍历 返回一个数组,包括对象自身的(不含继承的)所有可枚举属性(不含Symbol属性). var obj = {'0':'a','1':'b','2':'c'}; Object.keys(obj).forEach(function(key){ console.log(key,obj[ke...原创 2019-01-30 18:00:54 · 407 阅读 · 0 评论 -
Javascript思维导图10张
目录 导览 javascript变量 javascript运算符 javascript数组 javascript流程语句 javascript字符串函数 javascript函数基础 javascript基础DOM操作 文档对象模型DOM BOM浏览器对象模型 javascript正则表达式 javascript变量 javascript运算符 javascri...转载 2019-06-20 17:19:10 · 646 阅读 · 0 评论 -
javascript一些使用技巧(ES6)
目录 1,位运算,双位操作符 2,Object[key]的妙用 3,Array.find 4,展开运算符 ...z 5,模板字符串 `` 6,默认参数值和强制参数 7,箭头函数可以隐式返回值 1,位运算,双位操作符 Math.floor(4.9) === 4 //true /*-----------------------------------------------...原创 2019-06-25 17:18:02 · 293 阅读 · 0 评论 -
时间格式化封装
更好的选择:JavaScript 日期处理类库 http://momentjs.cn/ Date.prototype.Format = function (fmt) { var o = { "M+": this.getMonth() + 1, // 月份 "d+": this.getDate(), // 日 "h...原创 2019-09-17 10:18:02 · 191 阅读 · 0 评论 -
JS中的3大数据类型
基本类型: 数字(Number),布尔(Boolean),字符串(String) 复合类型: 对象(Object,时间Date,正则表达式RegExp等),函数(Function),数组Array 空类型: Undefined Null...原创 2018-07-06 18:27:05 · 446 阅读 · 0 评论 -
JS函数中 this 的指向问题
普通函数中的 this ——> window 定时器中的 this ——> window 构造函数中的 this ——> 实例对象 方法中的 this ——> 实例对象 原型中的方法中的 this ——> 实例对象 ES6新增箭头函数: () => {} 中的 this 指向箭头函数所在层的this(this指向不改变) ...原创 2018-07-06 15:08:36 · 299 阅读 · 0 评论 -
JS面向对象中继承的4种的方式
继承的方式: 1,通过原型继承 2,借用构造函数继承 3,组合继承 ---- 原型继承 + 构造函数继承 4,拷贝继承原创 2018-07-06 15:01:01 · 1436 阅读 · 0 评论 -
JavaScript的值传递和引用传递(深入剖析)
JavaScript有5种基本的数据类型,分别是:Boolean、String、Number、 null、undefined这些基本类型在赋值的时候是通过值传递的方式。空类型 null、undefined 也可算基本类型中 还有另外3种复合类型: Array,Function,Object,它们通过引用来传递。从底层技术上看,它们三都是对象。 基本数据类型 如果一个基本的数据类型绑定到某...转载 2018-05-27 15:01:27 · 223 阅读 · 0 评论 -
字符编码
ASCII 码表 ASCII 码使用指定的7 位或8 位二进制数组合来表示128 或256 种可能的字符 * 0~31 及127: 控制字符或通信专用字符(其余为可显示字符) * 32~126: 是字符(32是空格) * 48~57: 数字 0~9 * 65~90: 大写英文字母(26个)A~Z * 97~122: 小写英文...原创 2018-05-26 10:46:56 · 232 阅读 · 0 评论 -
JS面向对象的3大特性
1,抽象性 所谓抽象性:如果需要用一个对象描述一个数据,需要抽取这个对象的核心数据。 (1)抽取核心属性与方法 (2)不在特定环境下无法明确对象的具体意义 2,封装性 将数据与功能组合到一起,即封装 (1)js对象就是键值对的集合 * 键值对如果是数据(基本数据,复合数据,空数据)(非函数),就称为属性property * 键值对如果是函数,就称为方...原创 2018-05-26 10:17:06 · 670 阅读 · 0 评论 -
构造函数的执行过程
1,new 创建对象,然后传递给构造函数的this 2,在构造函数内部使用对象的动态特性为对象添加成员原创 2018-05-26 09:50:29 · 2009 阅读 · 0 评论 -
jQuery对象与DOM对象的区别及联系
jQuery对象与DOM对象的区别,联系 DOM对象:使用JavaScript的方法获取的对象就是DOM对象。 jQuery对象:使用jQuery的方法获取的对象就是jQuery对象。 jQuery对象其实就是DOM对象的包装集(包装了DOM对象的集合(伪数组)) 区别 DOM对象与jQuery对象的方法不能混用。 联系 jQuery对象与DOM对象可以互相转换。 DOM —...原创 2018-02-11 19:30:08 · 869 阅读 · 0 评论 -
jQuery优点总结
jQuery优点总结 1. 查找元素的方法多种多样,灵活。 2. 拥有隐试迭代特性,因此不再需要手写for循环了。 3. 完全没有兼容性问题。 4. 实现动画很简单,且功能更加强大。 5. 代码简单粗暴。 设置性操作:可以链式编程; 获取性操作:不能链式编程,因为获取到的是数值,字符串,返回值不是一个 jQuery 对象。 jQuery 的入口函数要比 JS 的入口函数执行得...原创 2018-02-11 19:29:30 · 1360 阅读 · 0 评论 -
JS的基本DOM操作(增删改查)
### 查找 ### (就是获取元素) (1),标准DOM API document.getElementById(id); document.getElementsByTagName(name); document.getElementsByName(name); document.getElementsByClassName(names)...原创 2018-06-29 20:50:01 · 4551 阅读 · 0 评论 -
关于返回值是伪数组的DOM操作注意点
如果返回值是伪数组,需加下标或 for循环遍历 方可DOM操作。原创 2018-06-30 16:39:28 · 751 阅读 · 0 评论 -
JS 特效三大系列【offset】【scroll】【client】
一. offset 系列 1. offset 系列的5个属性 1. offsetLeft : 用于获取元素到最近的定位父盒子的左侧距离 * 计算方式: 当前元素的左边框的左侧到定位父盒子的左边框右侧 * 如果父级盒子没有定位, 那么会接着往上找有定位的盒子 * 如果上级元素都没有定位,那么最后距离是与body的left值 2. offsetTop : 用于获取元素到最近定位父...原创 2018-07-01 10:32:08 · 506 阅读 · 0 评论 -
node节点属性
nodeType ------- 节点类型:返回值“1” —— 标签;返回值“2” —— 属性;返回值“3” —— 文本 nodeValue ------- 节点的值:null —— 标签;属性的值 —— 属性;文本内容 —— 文本 nodeName ------- 节点名字:大写的标签名 —— 标签;小写的属性名 —— 属性;#text —— 文本...原创 2018-06-19 18:09:47 · 742 阅读 · 0 评论 -
浅拷贝与深拷贝以及递归查询DOM树
浅拷贝: 只拷贝当前对象的属性和方法,如果属性和方法是引用类型则只拷贝地址,所以会指向同一块内存空间,不完全独立。 深拷贝: 连同结构一起拷贝,完全独立。 // 浅拷贝 function copy(obj1, obj2) { for (var key in obj2) { obj1[key] = obj2[key]; ...原创 2018-07-08 16:19:10 · 262 阅读 · 0 评论 -
JS中创建对象的3种方式
1,字面量的方式创建对象; var obj = { name: edison, age: 100, sayHi: function() { console.log(" 汪汪汪~"); } } 2,调用构造函数创建对象; var obj2 = new Object(); //调用系统的构造函数创建 obj2.name = edison; obj2.age = ...原创 2018-07-06 14:54:25 · 497 阅读 · 0 评论 -
构造函数,原型,实例对象三角关系图
原创 2018-05-27 16:30:01 · 1375 阅读 · 0 评论