javascript
文章平均质量分 61
阳光下的冷静
本人很菜,分享自己平时学习前端的小知识点,希望对大家有用。
展开
-
js创建对象--原型模式
原型模式的作用:原型模式是用来创建对象的,它是在构造函数创建对象基础上,为了实现数据的共享,这种共享包括属性的共享,也包括方法的共享。原型模式的使用:既然原型模式是在构造函数模式的基础上改进的,那么这种模式会既有构造函数的特点又有原型模式的特点。关于原型模式的使用方法用一句话总结:不需要共享的数据写在构造函数中,需要共享的数据写在原型中。所以在这样的一种情景中:如果想要使用一些属性...原创 2018-12-04 18:41:13 · 169 阅读 · 0 评论 -
原型的this指向改变&&原型中的方法相互访问
原型this指向改变:原型的this指向是可以改变的。我们知道实例对象的原型_proto_指向的是该对象所在的构造函数中的原型对象prototype,但是如果构造函数的原型对象(prototype)指向如果改变了,那么实例对象的原型(_proto_)也会改变。案例:具体如下代码: //人的构造函数 function Person(age){...原创 2018-12-04 19:12:01 · 730 阅读 · 0 评论 -
js原型实现继承
继承:继承是一种关系,类与类之间的关系,但是js中没有类,所以通过构造函数来模拟类,然后通过原型来实现继承。继承也是原型的第二个作用,同样是为了数据共享,原型中实现继承其实就是改变对象的原型指向借用构造函数继承:写法:构造函数名字.call(当前对象, 属性, 属性, 属性。。。)案例:具体代码如下 function Person(name, age, sex, weig...原创 2018-12-04 20:05:56 · 704 阅读 · 0 评论 -
js类型转换--逻辑运算
js基本类型:js的基本类型有六种,分别是Undefined , Null, Boolean , String , Number和Object 。js基本类型转换Boolean值:在js语法中,通常会有将基本类型转换成boolean类型,然后根据转换后的boolean类型做条件判断语句。这类的转换总结起来,可以概括为如下两句话:任何对象转为布尔值,都为得到 true(切记!在 JS...原创 2018-12-07 19:43:38 · 505 阅读 · 0 评论 -
JavaScript RegExp对象方法
JavaScript RegExp对象方法 总共有三种,分别是test() , exec() , 和compile()test() 方法用来检测一个字符串是否匹配某个正则表达式,如果匹配成功,返回 true ,否则返回 false; exec() 方法用来检索字符串中与正则表达式匹配的值。exec() 方法返回一个数组,其中存放匹配的结果。如果未找到匹配的值,则返回 null; compi...原创 2018-12-07 19:53:01 · 238 阅读 · 0 评论 -
js闭包
什么是闭包?闭包其实是一个函数,指的是有权访问另一个函数作用域(函数内部)中的变量的函数。由于javaScript语言的特殊之处,变量的作用域只有两种:全局变量和局部变量,并且有两条关于访问变量的规则。函数内部可以直接访问,读取全局变量 在函数外部无法直接读取函数内的局部变量注意:函数内部声明变量的时候一定要使用var命令,如果不用,那么这里变量实际上是全局变量关于上述的两条规则和...原创 2018-12-08 11:24:25 · 124 阅读 · 0 评论 -
js函数
函数的角色:函数有两个不同的角色:函数声明: function f1() { console.log("我是函数"); } f1();函数声明也有另外一种情况: if(true){ function f1() { console.log("哈哈,我又变帅了"); } }else{ ...原创 2018-12-05 20:34:36 · 111 阅读 · 0 评论 -
js检测变量类型--typeof && instanceof
变量类型的检测有两种常见的操作符: typeof 和instanceoftypeof 操作符:typeof操作符是一个操作符而不是函数,它操作数可以是变量也可以是数值字面量。typeof能够正确的判断基本数据类型,但是除了null, typeof null 输出的是对象typeof操作符检测一个变量时返回值只能是几种情况,具体如下:返回值是"undefined" ----如果...原创 2018-12-05 21:03:05 · 539 阅读 · 0 评论 -
js中的var , const , let的区别
var:var定义的变量可以进行修改,但是如果在开始的声明的时候没有初始化就会输出undefined,但是不会报错,同时var定义的变量可以在使用后声明。注:使用var声明的变量会自动被添加到最接近的环境中。在函数内部,最接近的环境就是函数的局部环境;在with语句中,最接近的环境就是函数环境;如果初始化变量时没有使用var声明,改变量会自动被添加到全局环境案例如下: var ...原创 2018-12-05 21:43:00 · 301 阅读 · 0 评论 -
JavaScript中的call(),apply()和bind用法
作用:call()、apply()、bind() 都是用来重定义 this 这个对象的apply()和call()方法:function F1(x,y){ console.log("结果是:"+(x+y)+this); return "10000";}//第一部分调用F1.apply();//输出 结果是:NaN[object Window]F1.call()...原创 2018-12-03 20:45:16 · 254 阅读 · 0 评论 -
js创建对象方法--字面量, 构造函数,工厂模式
创建对象方式:字面量的方法:var per1 = { name: "卡卡西", age: 20, sex: "男", eat: function () { console.log("吃臭豆腐"); }, readBook: function () { console.log("天堂"); }...原创 2018-12-03 21:30:19 · 373 阅读 · 0 评论 -
js延长作用域链
虽然执行环境的类型只有全局函数和局部函数,但还是有其他办法来延长作用域的。实现的原理是有些一句可以在作用域的前端临时加一个变量对象,该变量对象会在代码执行后被移除。有两种情况可以达到这种效果:try-catch语句的catch块 with语句上面两个语句都会在作用域的前端添加一个变量对象。对with语句来说,会将指定的对象添加到作用域中;对catch语句来说,会创建一个新的变量对象,其...原创 2018-12-06 20:05:45 · 1771 阅读 · 2 评论 -
重置浏览器样式
每种浏览器都有一套默认的样式表,即user agent stylesheet,网页在没有指定的样式时,按浏览器内置的样式表来渲染。这是合理的,像word中也有一些预留样式,可以让我们的排版更美观整齐。不同浏览器甚至同一浏览器不同版本的默认样式是不同的。但这样会有很多兼容问题,为了兼容所有的浏览器,需要一些解决办法。最简单的办法:(不推荐使用)*{margin: 0;padding: 0;}...原创 2018-12-26 19:24:28 · 605 阅读 · 0 评论 -
浏览器内核
浏览器内核:主要两部分:渲染引擎(layout engineer或 Rendering Engine) 和 JS 引擎 渲染引擎:负责取得网页的内容(HTML、 XML 、图像等等)、整理讯息(例如加入 CSS 等),以及计算网页的显示方式,然后会输出至显示器或打印机。浏览器的内核的不同对于网页的语法解释会有不同,所以渲染的效果也不相同。所有网页浏览器、电子邮件客户端以及其它需要编辑、显示...原创 2018-12-26 19:55:43 · 212 阅读 · 0 评论 -
cookies,sessionStorage 和 localStorage 的区别
sessionStorage和localStorage是HTML5 Web Storage API提供的,可以方便的在web请求之间保存数据。有了本地数据,就可以避免数据在浏览器和服务器间不必要地来回传递。localStorage:用于持久化的本地存储,数据永远不会过期,关闭浏览器也不会丢失。sessionStorage :同一个会话中的页面才能访问并且当会话结束后数据...原创 2018-12-24 18:03:50 · 268 阅读 · 0 评论 -
表单的基本组成和提交方式区别
表单由三部分组成:表单标签、表单域、表单按钮: 表单标签:这里面包含了处理表单数据所用 CGI 程序的 URL, 以及数据提交到服务器的方法。 表单域:包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框、和文件上传框等。 表单按钮:包括提交按钮,复位按钮和一般按钮;用于将数据传送到服务器上的 CGI 脚本或者取消输入,还可以用表单按钮来控制其他定义了处理...原创 2018-12-25 15:26:34 · 989 阅读 · 0 评论 -
常见浏览器兼容性问题与解决方案
浏览器兼容问题一:不同浏览器的标签默认的外补丁和内补丁不同 问题症状:随便写几个标签,不加样式控制的情况下,各自的margin 和padding差异较大。 碰到频率:100% 解决方案:CSS里 *{margin:0;padding:0;} 备注:这个是最常见的也是最易解决的一个浏览器兼容性问题,几乎所有的CSS文件开头都会用通配符*...原创 2018-12-25 20:12:27 · 287 阅读 · 0 评论 -
前端性能优化方法
解决办法一:减少http请求次数:CSS Sprites, JS、CSS源码压缩、图片大小控制合适;网页Gzip,CDN托管,data缓存 ,图片服务器。 前端模板 JS+数据,减少由于HTML标签导致的带宽浪费,前端用变量保存AJAX请求结果,每次操作本地变量,不用请求,减少请求次数 用innerHTML代替DOM操作,减少DOM操作次数,优化javascript性能。 当需要设置的样...原创 2018-12-25 21:15:09 · 7268 阅读 · 1 评论 -
HTTP与HTTPS
HTTP和HTTPS的基本概念:HTTP:是互联网上应用最为广泛的一种网络协议,是一个客户端和服务器端请求和应答的标准(TCP),用于从WWW服务器传输超文本到本地浏览器的传输协议,它可以使浏览器更加高效,使网络传输减少。 HTTPS:是以安全为目标的HTTP通道,简单讲是HTTP的安全版,即HTTP下加入SSL层,HTTPS的安全基础是SSL,因此加密的详细内容就需要SSL。 HTTPS...原创 2019-01-10 20:03:23 · 482 阅读 · 0 评论 -
Promise对象
什么是promise?Promise对象代表:了未来将要发生的事件,用来传递异步操作的消息Promise对象的两个特点:Promise对象的状态不受外界的影响,每个Promise对象代表一个异步操作,总共有三种状态:pending(等待) : 初始状态,不是成功或者失败的状态 fulfilled(已完成) : 成功时的状态,意味着操作成功完成 rejected(已拒绝) : 失...原创 2019-01-05 21:01:26 · 240 阅读 · 0 评论 -
Javascript表单验证
JavaScript表单验证:JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证。JavaScript验证内容:验证表单数据是否为空? 验证输入是否是一个正确的email地址? 验证日期是否输入正确? 验证表单输入内容是否是为数字型?逐个分析JavaScript表单验证内容: 必填(或必选)项目 该验证用来检查用户是否已填写表单...原创 2019-01-06 20:09:44 · 3128 阅读 · 0 评论 -
http状态码
http状态码:100-199 用于指定客户端应响应的某些动作 200-299 用于表示请求成功 300-399 用于已经移动的文件并且常被包含在定位头信息中指定新的地址信息 400-499 用于指出客户端的错误 500-599 用于指出服务器错误具体如下: 100 Continue 继续,一般在发送post请求时,已发送了http header之后...原创 2019-01-02 16:54:55 · 174 阅读 · 0 评论 -
内存泄露与垃圾回收
内存泄露:指任何对象在您不再拥有或需要它之后仍然存在。哪些操作会造成内存泄漏?setTimeout 的第一个参数使用字符串而非函数的话,会引发内存泄漏。 闭包 控制台日志 循环(在两个对象彼此引用且彼此保留时,就会产生一个循环)内存泄露解决办法:垃圾回收垃圾回收原理:找出那些不再继续使用的变量,然后释放其占用的空间垃圾回收器操作:按照固定的时间间隔(或代码执行中预定的收集时...原创 2019-01-02 17:25:30 · 265 阅读 · 0 评论 -
JSON
什么是JSON?JSON:JavaScriptObjectNotation(JavaScript 对象表示法) JSON 是存储和交换文本信息的语法。类似 XML。 JSON 是轻量级的文本数据交换格式,比XML 更小,更快,更易解析 JSON 独立于语言:JSON 使用 Javascript语法来描述数据对象,但是 JSON 仍然独立于语言和平台。JSON 解析器和 JSON 库...原创 2019-01-09 16:23:15 · 158 阅读 · 0 评论 -
JS变量提升
什么是变量提升?变量提升(Hoisting)是人们对JavaScript执行上下文工作方式的一种认识,并不是官方给出的改变。从字面上理解,变量提升的意思是变量和函数的声明会在物理层移动到作用域的最前面,虽然这样理解并不准确,效果是相同的。变量提升实际的实现方式是JavaScript的变量和函数的声明会在编译阶段放入内存。这意味着使用者在正式声明一个函数或者变量之前就能够使用它。要搞清楚变量...原创 2019-02-25 18:18:28 · 1877 阅读 · 2 评论 -
js数组经典面试编程题
春招,秋招甚至是实习,多多少少会面临一些基础的编程题,这些编程题除了一些数据结构的典型情景,但是不能忽略,小看的也有一些基础编程题,如最简单的数组结构就有一些经典的编程题,这里进行简要的总结。数组去重:function Char(num){ var a = [] for(var i =0;i<num.length;i++){ if(a.index...原创 2019-03-08 21:50:20 · 3191 阅读 · 0 评论 -
JavaScript中本地对象,内置对象和宿主对象
对象分类:一般来说,可以创建并使用的对象有三种:本地对象, 内置对象,宿主对象,自定义对象首先解释下什么是宿主环境:一般宿主环境由外壳程序创建与维护,只要能提供js引擎执行的环境都可称之为外壳程序。如:web浏览器,一些桌面应用系统等。即由web浏览器或是这些桌面应用系统早就的环境即宿主环境。本地对象:ECMA-262 把本地对象(native object)定义为“独立于宿主环境...原创 2019-03-13 21:28:43 · 374 阅读 · 0 评论 -
js字符串,数组经典笔试编程题
注意:String及其包装对象是不可变类型,因此不能改变它本身,所以String的所有方法都是返回一个新的字符串,而不会改变原来的字符串字符串,数组经典笔试编程题:将字符串变成驼峰法function tuofengfa (name){ var arr = name.split('');//将整个字符串拆分成数组 //判断一下第一个是不是— ...原创 2019-03-09 14:46:08 · 1579 阅读 · 0 评论 -
前端典型设计模式
模块模式:在立即执行函数表达式中定义的变量和方法在外界是访问不到的,只能通过其向外部提供的接口,"有限制"地访问.通过函数作用域解决了属性和方法的封装问题 案例:var Person = (function(){ var name = "xin"; var age = 22; function getName(){ return name; ...原创 2019-03-09 17:08:34 · 112 阅读 · 0 评论 -
document load 和document ready的区别
DOM文档解析:解析html结构 加载脚本和样式文件 解析并执行脚本 构造html的DOM模型 //ready 加载图片等外部资源文件 页面加载完毕 //load页面加载完成有两种事件load是当页面所有资源全部加载完成后(包括DOM文档树,css文件,js文件,图片资源等),执行一个函数,load方法就是onload事件。...原创 2019-03-14 15:36:45 · 5820 阅读 · 0 评论 -
js相等(==)与全等(===)的区别
相等是“==”,而全等是“===”,相等和全等的区别,总结就是:相等 ==: 先转换类型再比较 全等 ===:直接比较,不转换类型,只要是类型不同就不相等,类型相同的看值是否相等 Object.is(value1,value2):ES6 提出“Same-value equality”(同值相等)算法,用来解决这个问题。Object.is就是部署这个算法的新方法。它用来比较两个值是否严...原创 2019-03-14 15:55:42 · 2905 阅读 · 0 评论 -
js函数节流和去抖动
https://www.cnblogs.com/goloving/p/8672361.html转载 2019-03-10 13:36:01 · 126 阅读 · 0 评论 -
js的 for 跟for in 循环它们之间的区别?
遍历数组时的异同:for循环 数组下标的typeof类型:number,;for in 循环数组下标的typeof类型:string。代码如下:var southSu = ['苏南','深圳','16','男'];for(var i =0 ;i < southSu.length;i++){console.log(typeof i); //numberconsole....原创 2019-03-10 14:00:30 · 516 阅读 · 1 评论 -
Ajax入门理解
https://blog.csdn.net/WinstonLau/article/details/88364688转载 2019-03-10 14:15:41 · 121 阅读 · 0 评论 -
js同源策略
含义:浏览器安全的基石是“同源政策”(same-origin policy)“,同源政策由 Netscape 公司引入浏览器。目前,所有浏览器都实行这个政策。最初,它的含义是指,A 网页设置的 Cookie,B 网页不能打开,除非这两个网页“同源”。所谓“同源”指的是”三个相同“。同源条件:协议相同 域名相同 端口相同举例:http://www.example.com/dir/p...原创 2019-03-14 17:18:46 · 1689 阅读 · 0 评论 -
重绘与回流
回流(reflow):当render(CSSOM和DOM树连接一起形成render树,该树只包含用于渲染页面的节点)树中的一部分或者全部因为大小边距等问题发生改变而导致render需要重建render树的过程;此时,浏览器需要重新经过计算,计算后还需要重新页面布局,因此是较重的操作。重绘(repaint):当元素的一部分属性发生变化,如外观背景色等,不会引起布局变化而需要重新渲染的过程;...原创 2019-03-10 14:40:26 · 271 阅读 · 0 评论 -
暂时性死区
暂时性死区:在代码块内,使用let和const命令声明变量之前,该变量都是不可用的,语法上被称为暂时性死区。相关:let 和const 是使用块级作用域,而var 是使用函数作用域 let 和 const 声明之前访问对应的变量和常量,会抛出ReferenceError错误,但在var 声明之前就访问对应的变量,会得到undefined暂时性死区的本质就是,只要一进入当前作用域,所要使...原创 2019-03-10 15:18:19 · 4639 阅读 · 0 评论 -
浏览器解析URL
浏览器解析 URL过程:用户输入 URL 地址。 对 URL 地址进行 DNS 域名解获得IP地址。 建立 TCP 连接(三次握手)。 浏览器向 web 服务器发送一个 HTTP 请求报文。 服务器返回 HTTP 响应报文给客户端。 关闭 TCP 连接(四次挥手)。 浏览器解析文档资源并渲染页面。TCP 三次握手与四次挥手什么是 TCP 三次握手,什么是 TCP 四次挥手,...原创 2019-03-10 21:11:04 · 2720 阅读 · 0 评论 -
H5存储方式
html4.0---存储数据用cookie缺点:存储大小只有4kb cookie的存储随着http事物一起发送,浪费流量 操作复杂,封装和兼容性处理html5.0---webstorage形式:localStorage(本地存储)--永久性存储在浏览器本地,只要不手动删除,就不会消失(安全性差、不能跨域名访问、不能跨浏览器访问) sessionStorage(临时性存...原创 2019-03-11 16:03:05 · 461 阅读 · 0 评论 -
简单理解Promise(ES6)
Promise的含义:Promise:简单来说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。从语法上讲,Promise是一个对象,从它可以获取异步操作的消息;Promise是异步编程的一种解决方案,比传统的解决方案——回调函数和事件——更合理更强大,它提供统一的API,各种异步操作都可以用同样的方法进行处理;Promise对象特点:对象的状态不受外界影响。...原创 2019-03-19 20:37:38 · 479 阅读 · 0 评论