![](https://img-blog.csdnimg.cn/20201014180756757.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
js学习笔记
文章平均质量分 71
FAA.
good good study, day day up
展开
-
Web组件API
Web组件API最近学完 Vue 后发现它封装的 DOM 实在是太强大了。使用 Es6 Moudule 或 CommonJs Module 实现封装 Js 模块化比较简单。但是想要封装 DOM 真没那么简单。看了红宝书 JavaScript API 中的 Web组件 API,发现里面的内容跟 Vue 用到的方法很像,所以我就先看一下做一些基础知识储备,等哪天有能力了再模仿Vue自己封装一个 DOM,(感觉有点天真,哈哈哈 ~~)知识库template模板影子 DOM自定义标签一、templa原创 2021-11-13 23:57:32 · 802 阅读 · 0 评论 -
V8 快属性与慢属性
快属性与慢属性js对象是由一组组属性和值组成的集合,而js语言的角度来讲,js对象像一个字典,属性为键名,属性值为键值,通键名读取键值。而 V8 实现对象存储时,并没有采用字典的存储方式,原因是字典的数据结构是非线性的,存取速度会比线性数据结构慢很多。常规属性和排序属性// 常规属性和排序属性function Foo(){ this[100] = '100'; this[1] = '1'; this['b'] = 'b'; this[10] = '10';原创 2021-11-02 11:16:19 · 300 阅读 · 0 评论 -
js 中的继承
js 中的继承(一)原型链继承原理: 通过修改构造函数的原型指针指向一个类的实例不足:不能给父类构造函数传递参数,父类中的引用类型属性共享function SuperType() { this.property = true;}SuperType.prototype.getSuperValue = function () { return this.property;};function SubType() { this.subproperty = false原创 2021-11-02 09:27:44 · 66 阅读 · 0 评论 -
原型与原型链
原型与原型链原型无论何时,只要创建一个函数,就会按照特定的规则为这个函数创建一个 prototype 属性(指向原型对象)。默认情况下,所有原型对象自动获得一个名为 constructor的属性,指回与之关联的构造函数。function Person(name, age){ this.name = name; this.age = age; } const p = new Person('小明',21); console.log(p); // co原创 2021-10-30 23:24:39 · 64 阅读 · 0 评论 -
js对象的数据属性、访问器属性和属性枚举
对象属性属性的类型js对象的分两种:**数据属性 **和 访问器属性(一) 数据属性顾名思义,数据属性就是用来直接保存数据的属性,一般情况下,我们都只会定义和操作数据属性1. configurable 定义属性是否可以为 delete 重新定义或修改为访问器属性,默认 true2. enumerable 定义属性是否可以被枚举,默认 true3. writable 定义属性是否可以被修改,默认 true4. value 属性的值显性设置属性的参数 1. writable 测试原创 2021-10-30 22:09:18 · 281 阅读 · 0 评论 -
对象标识和相等判断
对象标识和相等判断判断 对象是否的相等的方法,对于不同的情况,需要用到不同的方法,比较常用的有 三等号 “===”, isNaN(number)函数, Object.is(obj1, obj2)方法三等号 ===对象实例相等判断 function Person(name){ this.name = name; }const p1 = new Person('小明');const p2 = new Person("小明");console.log(p1 === p2); //原创 2021-10-30 19:33:33 · 98 阅读 · 0 评论 -
对象合并混入
对象合并混入在 MVVM 框架中有 mixin 混入功能,它的作用就是把 每个对象 功能的特性都抽出来整合成一个 或多个 源对象,再把这些源对象混入(合并)到需要这些共有功能的目标对象中,比如 VUE 的 mixinES6 新增了 Object.assign 功能来合并对象个人觉得混入(合并)功能跟 继承的目的有点相同, 合并对象是一种**面向切面编程(AOP)的开发模式,而继承是面向对象(OOP)**的开发模式 const dogTarget = { name: 'jack',原创 2021-10-30 17:21:42 · 112 阅读 · 0 评论 -
原生js使用模块化思想解决多人合作中全局变量污染冲突问题
原生js使用模块化思想解决多人合作中全局变量冲突问题问题引入我们在参加软件设计大赛做多人合作项目时,负责前端部分有两个人,我们使用的是原生js+JQuery来编写代码(当时只学了这些),由于当时没有学习ES6的模块化,再加上都是一多人合作写项目,在整个项目完成下来踩了不少坑,其中最大的坑就是代码冲突,主要是全局变量污染的锅,每次合并代码都会有莫名其妙的问题。案列小明和小红两个各自写自己的js代码,最终合并到同一个index.html中<!-- index.html -->&l原创 2021-03-13 21:46:47 · 602 阅读 · 0 评论 -
DOM扩展——自定义属性
DOM扩展——自定义属性引言我们有时候在看别人的html代码的时候,会发现别人的标签中的自定义属性都会以data作为前缀,不同的单词都会用’-'相连,这是为啥呢?一种规范 or 一种语法?自定义属性看了DOM扩展后,发现原来是有一种专门的方法来操纵自定义属性的!基本用法了解 dataset属性 <div id = 'myDiv' data-app-id = 'id01' data-myName = 'anan' active = 'true'>你好,李焕英!</div原创 2021-03-06 17:31:09 · 482 阅读 · 1 评论 -
ES6异步发送AJAX
ES6异步发送AJAX异步与同步的区别同步:在上一个操作没有执行完前,下一个操作必须排队等待异步:CPU先把当前操作耽搁不执行,等主线任务执行完后再执行ES6前的异步操作在ES6发布之前,要操作异步,只能使用递归或者回调函数来操作,但是这样会使得代码可读性差,难维护。js的运行机制是单线程的,它首先会执行同步的操作,再按照代码的位置先后顺序执行异步操作。js 中的核心异步执行函数是定时器和ajax setTimeout(console.log, 0, 1);原创 2021-02-20 00:49:54 · 397 阅读 · 0 评论 -
async函数 -- 异步函数
async函数 – 异步函数作用ES2017推出的一种新的处理异步请求方法,是generator的语法糖(generator的优化),可以用来轻松定义异步函数对比generatorasync 取代 *await 取代 yieldasync不需要自己手动移动指针,它会自动执行,如果在某个阶段执行失败则会终止执行后面的任务,而generator需要手动调用next()一步步执行await右边是表达式或语句,如果它返回不是Promise对象会调用Promise.resolve()原创 2021-02-19 23:33:09 · 726 阅读 · 0 评论 -
Promise对象--个人理解
Promise对象作用有了Promise对象,就可以将异步操作以同步操作的流程表达出来,避免了层层嵌套的回调函数。此外,Promise对象提供统一的接口,使得控制异步操作更加容易定义Promise对象是一个期约,定义着未来发生的事件,它有3种状态,表示着一个任务的状态,它们分别是pending(进行中), fulfilled(成功),rejected(失败);Promise对象可以比喻成一个容器,里面装着外来才会结束的事件(通常是异步操作)的结果。特点Promise的状态只能有内部的决定原创 2021-02-19 22:13:37 · 249 阅读 · 0 评论 -
一个例子让你理解Generator语法
Generator 生成器一个例子让你理解Generator语法理解:从语法上讲,generator是一个状态机,它封装着其内部很多的状态执行一个generator函数,会返回一个迭代器对象(有next()方法,可以手动单步访问内部代码)例子 function* foo(){ consloe.log('hi!'); // hi! let a = yield 'hello'; yield console.log(a); // aaaa原创 2021-02-19 18:09:27 · 283 阅读 · 0 评论 -
ES6模块和Commonjs的差异
ES6模块和Commonjs的差异CommonJS 是 nodejs 中的模块化工具,只能使用在服务器端,而ES6模块是 客户端开发的模块化工具,只能使用在客户端CommonJS 模块输出的是一个值的拷贝,ES6 模块输出的是值的引用。CommonJS// module.js let count = 3;const doCount = function(){ count ++;}module.exports = {count, doCount};// main.js原创 2021-02-18 20:54:02 · 110 阅读 · 0 评论 -
ES6模块
ES6模块一般的script脚本导入是把所有的要使用的js文件按照所有js的依赖关系,先后导入到html页面上 <script src="../js/jquery-3.5.1.js"></script> <script src="../js/jquery.cookie.js"></script> <script src="../js/logOn.js"></script> <script src原创 2021-02-18 18:59:54 · 141 阅读 · 1 评论 -
supervisor -- nodejs 自启动工具
supervisor – nodejs 自启动工具原生启动了服务器后,如果代码有更新,需要使用 ctrl + c 关闭后,重新 node js 文件名重启如果有了supervisor就可以自动的更新服务器npm – node packages manager node 包管理工具, node 有自带,如果不行就下载 cnpm (中国版的npm, c – chinese, 由乐于分享的淘宝团队开发,服务器在中国)安装 supervisor在终端输入 npm install -g s原创 2021-02-18 18:46:27 · 249 阅读 · 2 评论 -
node模块
node模块在node中,模块被分成两种:核心模块(http模块、URL模块、FS模块)和自定义模块,也叫文件模块node 模块是 CommonJS的实现自定义模块需要按照CommonJS的规范来定义一个js文件就是一个模块一个模块里面的变量、方法等默认是只能在本文件中被访问,只有导出后才能被其他模块访问导出方法:如果是把所有数据都写在了一个对象里面,那么就用module.exports=对象名,这样都出后就是把整个对象导出,不会产生新对象如果是以多个方法、变量导出就使用exports原创 2021-02-18 18:43:45 · 589 阅读 · 5 评论 -
对象属性的动态与静态
对象属性的动态与静态我们想要把a设置为obj的属性,当a变化时,obj.a也跟着改变 let a = 1; const obj = { a } a++; console.log(a, obj.a); // a = 2, obj.a = 1;为什么会这样? 其实是源于 js 值的赋值,对于基本的数据类型是拷贝值的,会赋值一份与当前值相同的数据到一个新的值上,两者是没有任何联系的。如果a是原创 2021-02-18 17:46:30 · 1211 阅读 · 2 评论