javascript知识
文章平均质量分 71
javascript知识
独坐空山后
努力成为前端大佬的打工仔
展开
-
10-javascript基础---symbol数据类型和interator接口
一、Symbol数据类型在ES6中,提出了一个新的基本数据类型Symbol特点:Symbol的值是唯一的:解决命名冲突问题Symbol的值,无法与其他数据进行计算,包括字符串拼接for in, for of遍历不会遍历Symbol属性使用:传参标识let symbol = Symbol('one')console.log(symbol) // Symbol(one)console.log(typeof symbol) // Symbol调用Symbol函数得到原创 2020-10-16 22:19:12 · 227 阅读 · 0 评论 -
09-javascript基础---let和const
一、let1、作用与var类似,用于声明一个变量2、特点无法重复声明在块级作用域有效会预编译,有变量提升,但是不能提前使用提升的变量/* 无法重复声明 */let a = 123let a = 345 // 报错3、let的变量提升全局变量提升:会创建一个变量对象Script,用来收集全局作用域下 let 定义的变量,但是没有赋值局部变量提升:会将var let定义的变量全部放到当前函数的变量对象中与var变量提升的区别:let的变量提升,在为赋值无法使用原创 2020-10-11 15:53:49 · 104 阅读 · 0 评论 -
08-javascript基础-Object & Array & Function拓展
一、Object拓展ES5給Object拓展了一些静态方法,常用的:1、 Object.create写法:Object.create(原型对象, [自有属性])作用:以指定对象为原型,创建新的对象// 原型对象var obj = { name: 'Tom', showName: function () { console.log(this.name) }}// 新对象var obj2 = Object.create(obj, { name: { val原创 2020-10-11 15:51:42 · 104 阅读 · 0 评论 -
07-javascript基础----js对象&&继承
一、对象基础1. 对象属性的方式对象属性的方式有两种:obj.xxxobj['xxx']那么,什么时候用到第二种([‘属性名’])的方式呢?当属性名不是合法的标识名时var obj = {}obj.content-type = 'application' // 报错obj['content-type'] = 'application' // 正确当 属性名不确定时var obj = {}// 想要将 param 的值 作为 keyvar param = 'ag原创 2020-10-06 21:06:00 · 156 阅读 · 0 评论 -
06-javascript基础----js闭包
一、闭包1、理解看这段代码:function foo() { var i = 1 function show() { i += 1 console.log(i) } return show}var a = foo()a()正常情况,函数定义时,开辟一个内存空间,使用结束后,该变量取消指向内存地址,内存地址准备被销毁如果内部函数引用了外部函数的值,那么就会形成闭包2、 概念闭包是一个存在内部函数 的引用关系该引用指向的是 外部原创 2020-10-05 23:01:15 · 114 阅读 · 0 评论 -
05-javascript基础----js作用域
一、作用域1. 概念 & 作用作用域,就是一个代码块所在的区域,它是静态的,在编写代码时就已经确定了不同于执行上下文,(执行上下文是动态的,执行创建)举例:执行上下文时 建房子 时的 打地基作用域 是 建房子 时的 区域作用:用来决定代码执行的范围,变量所属的范围2. 作用域和执行上下文区别作用域执行上下文创建时刻函数定义function a() {}函数调用a()性质静态的,函数定义了,就不会变化动态的存在时间不会变化调用时创建,原创 2020-10-03 16:00:20 · 89 阅读 · 0 评论 -
04-javascript基础----js执行上下文
一、变量提升 & 函数提升1. 概念js引擎在js代码正式执行之前,会做一些 预解析 的工作找关键字: var、function找到 var 以后将 var 后边的变量提前声明,但是不赋值 :var a;找到 function 以后,定义对应的函数,也就是说,函数在预解析的时候已经定义完毕预解析:全局预解析,局部预解析2. 证明2.1、实例我们可以使用 断电调试的方法,来证明变量 & 函数 是否提升如以下代码:console.log('程序开始'原创 2020-10-02 21:11:12 · 176 阅读 · 0 评论 -
03-javascript基础----js原型和原型链
一、原型1.1、什么是原型对象原型对象的本质,就是一个普通的Object实例{}每个函数都有一个prototype属性,该属性指向的是原型对象(显示原型对象)每个实例对象身上都有一个__proto__属性,该属性指向的也是原型对象(隐式原型对象)构造函数的显示原型 === 当前构造函数实例对象的隐式原型function Person(name, age) { this.name = name; this.age = age; this.showAge = func原创 2020-09-30 12:22:58 · 218 阅读 · 0 评论 -
02-javascript基础----js函数
一、什么是函数函数也是对象的一种,但是函数区分与对象最重要的一点:函数具有可执行性对象:var a = { name: 'wang'}函数:function a() { var a = 'wang' console.log(a)}a()二、为什么要设计函数简化代码的编写,减少重复代码功能点明确,复用,一个函数通常只有一个指定的功能隔离变量,减少命名污染function a() { var name = 'wang'}function b() { v原创 2020-09-30 12:20:06 · 103 阅读 · 0 评论 -
01-javascript基础----js数据类型
一、js数据类型1、分类js的数据类型分为两种:基本数据类型:String、Number、Boolean、Null、undefined引用数据类型:Object、Array、functionJS只有 堆内存 结构,我们所说的 堆栈内存 是指这个堆内存中像栈内存的分离出来2、基本数据类型基本数据类型的存放方式,是存放在栈内存中,拥有以下特性:基本数据类型的特点:一旦定义了值,就不会改变var a = 123a = 234先在栈内存开拓一个空间,存放值 123定义一个变量a,指向原创 2020-09-30 12:18:48 · 112 阅读 · 0 评论 -
你真的会用 Promise 吗,快来看看正确的写法!!!
这个思路,是 受到 七月老师的教导的当我们遇到回调地狱,通常都是怎么解决的呢,如果不使用 async/await,那么写出来的代码,大部分(包括我)都是又臭又长的,不忍直视,那么使用下面的写法,会更加赏心悦目哦1.第一种,普通的写法 bookModel.getHotList().then(res => { console.log(res) bookModel.getMyBookCount().then(res => { console.log(res原创 2020-07-26 18:31:27 · 296 阅读 · 1 评论 -
前端优化之---- 懒加载
1、什么是懒加载意思就是:需要用到的时候才去加载这个资源,也就是 延时加载2、为什么要使用懒加载 当进去某个页面时(比如淘宝之类的推荐页面),会有许多的图片等等资源,而这时我们不去翻动看下面的数据,也就意味着这个数据浪费了,白加载了,而且降低了网页的加载速度(一个网站如果打开速度太慢,用户体验是极差的) 如果使用懒加载,下面的数据等我们往下翻才加载,才不会浪费,这样可以加快页面的加载速度,也可以减少服务器的压力,提高前端的性能3、懒加载的原理例如图片懒加载:原创 2020-05-15 14:08:02 · 1002 阅读 · 0 评论 -
都0202年了,你必须懂的防抖和节流!!!
1、防抖与节流的区别防抖与节流的区别就是:假设你一直点击一个按钮:**防抖:**一直刷新计算时间,一直不会执行,除非等你 2 次点击的间隔时间大于等于防抖的间隔时间节流:点击后,触发一次,等到间隔时间到达,你如果再点击会再触发,而在此期间是不会触发的你点击的频率: * * * * * * * * * * * * * * * * * * * * * *防 抖 触 发 : ---------------------- !-----------------------原创 2020-05-13 14:28:37 · 1216 阅读 · 0 评论 -
ES6数据结构 --- set、map
1、setset类似于数组(Array),不过 set 的成员是唯一的const s = new Set();s.add(1);s.add(2);/* 支持链式调用 */// s.add(1).add(2)console.log(s) // Set(2) --> 1、2如果添加相同的数据,会将相同的成员去重const s = new Set();s.add(1).add(1);console.log(s) // Set(1) --> 1小妙用利用set的成员唯原创 2020-05-10 20:22:18 · 351 阅读 · 0 评论 -
ES6对象模块(二) --- ES6模块系统
二、ES6模块系统ES6 的 模块化,语言上支持,但是浏览器不支持,所以需要将其编译 : 如webpack2.1、简单步骤:导出export let a = 12;export function duck(){ console.log("我真帅")}导入import * as mod1 from './mod'console.log(mod1.a)mod1.duck()webpack编译(需要webpack环境)以下为webpack的配置文件webpack.co原创 2020-05-09 00:10:24 · 363 阅读 · 0 评论 -
ES6对象模块(一) --- ES6的面向对象
一、面向对象1.1 ES5的面向对象ES5 实际上不是真的面向对象没有统一的写法// 1. 既是构造函数,又是类function Person (name, age) { this.name = name; this.age = age;}// 2. 方法在类之外Person.prototype.show = function() {}// 3. 没有专门的继承function worker(name, age, job) { // 4. 从父类继承的一种方式原创 2020-05-09 00:09:11 · 427 阅读 · 0 评论 -
ES6新增特性 --语法篇(四) --- 异步操作
5、异步操作优点:同时进行多个操作用户体验比较好缺点:容易陷入回调地狱5.1、解决办法一:PromisePromise 实际上是封装了 回调5.1.1、使用方法:写请求方法// ajax也返回一个 promise,这里封装是为了理解let p = new Promise((resolve, reject) => { $.ajax({ // url: 路径 url: '1.txt', dataType: 'json', // 成功原创 2020-05-09 00:07:52 · 285 阅读 · 0 评论 -
ES6新增特性 --语法篇(三) --- babel.js编译
4、babel.js编译可以将es6、es7的编译成低版本(es5)的语法使用方法:编译JS文件1、按照node.js 初始化项目2、按照babel-clinpm i @babel/core @babel/cli @babel/preset-env -Dnpm i @babel/polyfill -S(可以不要)3、添加执行脚本"scripts": { "build": "babel src(目录文件入口) -d dest"}4、添加.babelrc配置文件{ "presets"原创 2020-05-09 00:06:33 · 230 阅读 · 0 评论 -
ES6新增特性 -- 语法篇(二) --- map、reduce、filter、forEach
2、方法2.1、map(映射)map(item, index) index可以不要map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。[45, 60, 80] --- [不及格, 及格, 良好]map() 方法按照原始数组元素顺序依次处理元素。注意: map() 不会改变原始数组。使用:let arr = [60, 53, 12, 90, 6...原创 2020-05-05 00:49:50 · 236 阅读 · 0 评论 -
ES6新增特性 --语法篇(一) --- 语法特性
1、语法特性1.1、变量letconst特性:无法重复声明let a = "1";let a = "2" // 报错,重复声明const 是定义常量的,无法修改const a = 1;a = 2; // 报错,常量再分配错误/* 但是因为function、Array、Object是引用值,不会报错 */const b = {name: "duck"};...原创 2020-05-05 00:48:01 · 262 阅读 · 0 评论