资讯专栏INFORMATION COLUMN

JavaScript知识点总结

sean / 705人阅读

摘要:参与任何数值计算的结构都是,而且。。面向人类的理性事物,而不是机器信号。达到无刷新效果。的工作原理总是指向一个对象,具体是运行时基于函数的执行环境动态绑定的,而非函数被声明时的环境。原型对象上有一个属性,该属性指向的就是构造函数。

1.JS面向对象的理解

</>复制代码

  1. 面向对象的三大特点:继承、封装、多态
  2. 1、JS中通过prototype实现原型继承
  3. 2、JS对象可以通过对象冒充,实现多重继承,
  4. 3Object类是所有Js类的基类
  5. 4、通过function对对象进行封装
  6. 5、通过使用arguments实现参数重载
  7. 6、ES6语法糖可以直接定义类class,继承对象extends
2.JS数据类型

</>复制代码

  1. 1.基本数据类型:
  2. Undefined:代表一切未知的事物,啥都没有,无法想象,代码也就更无法去处理了。
  3. 注意:typeof(Undefined) 返回也是 Undefined。可以将Undefined赋值给任何变量或属性,但并不意味了清除了该变量,反而会因此多了一个属性。
  4. Null:有那么一个概念,但没有东西。无中似有,有中还无。虽难以想象,但已经可以用代码来处理了。
  5. 注意:typeof(Null)返回Object,但Null并非Object,具有Null值的变量也并非object。
  6. Boolean:是就是,非就非,没有疑义。对就对,错就错,绝对明确。既能被代码处理,也可以控制代码的流程。
  7. Number:线性的事物,大小和次序分明,多而不乱。便于代码进行批量处理,也控制代码的迭代和循环等。
  8. 注意:typeof(NaN)和typeof(Infinity)都返回number 。NaN参与任何数值计算的结构都是NaN
  9. 而且 NaN != NaNInfinity / Infinity = NaN
  10. String:面向人类的理性事物,而不是机器信号。人机信息沟通,代码据此理解人的意图等等,都靠它了。
  11. 2.引用数据类型:ObjectArrayFunction
  12. 3.ES6新增的数据类型
  13. Set集合 :set与数组不同在于set中不可以有重复数据,常用于去重操作
  14. Map: 用map可以避免键值必须为字符串的限制,其键值可以为对象、数组等
  15. Symbol类型: 用相同的字符串对对象属性名或方法进行命名时会发生命名冲突,而使用symbol产生的名字是不同的
3.JS判断数据类型的几种方法

</>复制代码

  1. 1typeof
  2. 2prototype
  3. 3instanceof
  4. 4constructor
  5. 5、Object.prototype.toString.call(a)
  6. 注意 : typeof 1 // "number"
  7. typeof "1" // "string"
  8. typeof true // "boolean"
  9. typeof Symbol(1) // "symbol"
  10. typeof {} // "object"
  11. typeof [] // "object",小坑
  12. typeof function(){} // "function"
  13. typeof Symbol(1) // "symbol"
  14. typeof undefined // "undefined"
  15. typeof null // "object",出名的坑
  16. 区别:
  17. 1.typeof null === Object 无法判断出function(有些浏览器会出错)、arrayregExp
  18. 2. instanceof主要是判断引用类型,用来测试一个对象在其原型链中是否存在一个构造函数的 prototype 属性。
  19. 3.Object.prototype.toString是对象的一个原生原型扩展函数,用来精确的区分数据类型(最保险,不容易出错的判断方法)
4.Object对象的认知

</>复制代码

  1. JS中所有的对象都继承自Object
  2. 创建一个新对象:
  3. var person = new Object();
  4. person.name = "我有猫你没有";
  5. person.age = 25;
  6. constructor属性是保存当前对象的构造函数,前面的例子中,constructor保存的就是Object方法。
  7. hasOwnProperty方法接收一个字符串参数,该参数表示属性名称,用来判断该属性是否在当前对象实例中,而不是在对象的原型链中。
  8. isPrototype方法接收一个对象,用来判断当前对象是否在传入的参数对象的原型链上
4.Array数据的一些方法用法

</>复制代码

  1. concat() 连接两个或更多数组
  2. splice(index,len,[item]) 删除元素,并向数组添加一个新元素。
  3. Slice() 从某个已有的数组返回选定的元素
  4. Join() 把数组的所有元素放入一个字符串,元素通过指定的分隔符进行分割
  5. push() 在数组后添加元素,并返回新的长度
  6. unshift() 在数组最前添加元素
  7. pop() 删除数组最后一个元素并返回该元素的值
  8. reverse() 颠倒数组中元素的顺序
  9. shift() 删除并返回数组中第一个元素
  10. sort() 对数组元素进行排序
  11. toSource() 返回该对象的源代码
  12. toString() 把数组转换为字符串并返回结果
  13. toLocaleString() 把数组转换为本地数组,并返回结果
  14. valueOf() 返回对象的原始值
  15. 数组循环的几种方式和区别
  16. 1.map() 返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值(需要直接修改数组时可使用)
  17. 2.foreach() 用于调用数组的每个元素,并将元素传递给回调函数,只是遍历一次数组,不会去修改原数组(获取数据某些内容时使用)
  18. 3.filter() 创建一个新的数组,新数组中的元素是原始数组通过检查返回值为true的项(过滤数据时使用)
  19. 4.every() 用于检测数组所有元素是否都符合指定条件,如果数组中检测到有一个元素不满足,则整个表达式返回false,且剩余元素不会再进行检测;如果所有元素都满足条件,则返回true
  20. 5.some() 于检测数组中是否有元素满足指定条件(函数),如果有一个元素满足条件,则表达式返回true,剩余元素不再执行检测;如果没有满足条件的元素,则返回false
  21. 6. reduce() 数组累加器和数组中的每个元素 (从左到右)应用一个函数,将其减少为单个值
5.Function函数的理解

</>复制代码

  1. 两种自定义函数的方法 1.function fnName(){} 2. var fnName=function(){}
  2. 函数的返回值:1.当函数无明确返回值时,函数返回undefined2.有返回值返回。
  3. 函数的参数列表是可变的,数据类型也是任意数据类型,JS中有一个变量,argument可以访问所有传到函数内部的参数。
  4. Js支持创建动态函数,动态函数必须用Function对象来定义。
  5. 创建动态函数的基本格式:
  6. var 变量名 = new Function("参数1""参数2""参数n""执行语句");
  7. var add = new Function("x", "y", "return(x+y)");
  8. JavaScript不支持函数的重载。如果两个方法名字一样,即使参数个数不一样,那么后面定义的就会覆盖前面定义,调用方法时永远是调用后定义的那个。
6.Ajax请求的原理

</>复制代码

  1. 通过XMLHttpRequest对象来向服务器发送异步请求,从服务器获取数据。然后用JavaScript来操作DOM而更新页面。
  2. XMLHttpRequest是ajax的核心机制,它是IE5中首先引入的,是一种支持异步请求的技术。简单的说,也就是JavaScript可以及时的向服务器提出请求并及时响应。而不阻塞用 户。达到无刷新效果。由事件触发,创建一个XMLHttpRequest对象,把HTTP方法 (POST/GET)和目标URL以及请求返回后的回调函数设置到XMLHttpRequest对象,通过 XMLHttpRequest向服务器发送请求,请求发送后继续响应用户的界面交互,只有等到请求真正从服务器返回的时候才调用callback()函数,对响应数据进行处理。
  3. Function ajax(){
  4. If(window.XMLHttpRequest){
  5. Var xhr =new XMLHttpRequest();
  6. }else{
  7. Var xhr=new ActiveXObject(‘Microsoft.XMLHTTP’);
  8. }
  9. Xhr.onreadystatechange=function(){
  10. If(xhr.readState==4){}
  11. }
  12. }
7.JS闭包(Closure)

</>复制代码

  1. 闭包就是能够读取其他函数内部变量的函数。由于在JavaScript语言中,只有函数的内部的子函数才能读取局部变量,因此可以把闭包简单理解成“定义在函数内部的函数”。所以 在本质上,闭包就是讲函数内部和函数外部链接起来的一座桥梁。
  2. 闭包的用途:1.获取函数内部的局部变量。2.让这些变量始终保持在内存中。
  3. 注意:1.由于闭包会使得函数中的变量一直保存在内存中,所以不能滥用闭包,容易导致内存泄漏,影响网页性能,解决方法就是在退出函数之前,将不再使用的变量全部删除 (delete);2闭包会在父函数外部,改变父函数内部变量的值。所以,如果你把父函数当作对象(object)使用,把闭包当作它的公用方法(Public Method),把内部变量当 作它的私有属性(private value),这时一定要小心,不要随便改变父函数内部变量的值。
8.this的工作原理

</>复制代码

  1. This总是指向一个对象,具体是运行时基于函数的执行环境动态绑定的,而非函数被声明时的环境。
  2. 普通函数调用时,一般指向window对象;
  3. 对象方法调用时,指向该对象;
  4. 如果对象方法里有局部方法,里面的this会指向window对象;
  5. 在ES5模式下,this指向window的都会变成undefined
  6. Apply,call时,动态改变this
9.JS中继承的几种方法

</>复制代码

  1. Prototype 原型继承
  2. Call()
  3. Apply()
  4. //模拟extend
  5. var extend=function(target,source){
  6. for(property in source)
  7. {
  8. if(target.hasOwnProperty(property))
  9. {
  10. target[property]=source[property];
  11. }else{
  12. target.property=source[property];
  13. }
  14. }
  15. return target;
  16. }

10.原型链

</>复制代码

  1. 首先要理解原型
  2. 每个JS对象都有一个prototype原型属性,指向该对象继承的原型。
  3. 原型对象上有一个 constructor 属性,该属性指向的就是构造函数。
  4. 而实例对象上有一个 __proto__ 属性,该属性也指向原型对象,并且该属性不是标准属性,不可以用在编程中,该属性用于浏览器内部使用。
  5. 原型链:其实就是有限的实例对象和原型之间组成有限链,就是用来实现共享属性和继承的。

11.JS中的事件机制

12.

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/92523.html

相关文章

  • JavaScript 基础知识】一篇关于 JavaScript 一些识点总结 —— 持续更新

    摘要:中基础数据类型数据类型名称数据类型说明只有一个值,即,声明变量的初始值。只有一个值,即,表示空指针,的值是派生的值。由零或多个位字符组成只有两个值,即和该类型使用来表示整数和浮点数。中的对象其实就是一组数据和功能的集合。 JavaScript 中基础数据类型 数据类型名称 数据类型说明 Undefined 只有一个值,即 undefined ,声明变量的初始值。 Nul...

    felix0913 评论0 收藏0
  • 优化JavaScript总结分享(上)

    摘要:上面代码优化后尽量使用局部变量缓存全局变量在实际开发中尽量使用局部变量缓存全局变量,因为,到一个函数多次访问全局变量的时候,会出现一个作用域练查找的过程,全局作用域位置越深找到的时间就越久,因此这也会涉及到性能的执行速度问题。 本来想整理一篇完整的JavaScript优化知识点出来跟大家讨论分享一下的,但是由于最近个人的时间比较少,所以先整理了两个知识点,之后有时间了再继续整理后面的。...

    jackwang 评论0 收藏0
  • JavaScript 总结几个提高性能识点

    摘要:有兴趣的朋友可自行该知识点,这里件简单提下吧。并且可能一个点或者两个点不注意是不会产生多大性能影响,但是从多个点进行优化后,可能产生的就会是质的飞跃了 针对js文件的加载位置 在HTML文件中,标签是可以加在区域和区域的。这里鉴于JavaScript执行和UI渲染的单线程原因,如果js文件载入会阻塞后面对于页面的解析过程,页面会等到js文件完全加载并运行后才继续执行该做的操作。那么问题...

    nihao 评论0 收藏0
  • 全本 | iKcamp翻译 | 《JavaScript 轻量级函数式编程》|《你不知道的JS》姊妹篇

    摘要:本书主要探索函数式编程的核心思想。我们在中应用的仅仅是一套基本的函数式编程概念的子集。我称之为轻量级函数式编程。通常来说,关于函数式编程的书籍都热衷于拓展阅读者的知识面,并企图覆盖更多的知识点。,本书统称为函数式编程者。 原文地址:Functional-Light-JS 原文作者:Kyle Simpson - 《You-Dont-Know-JS》作者 译者团队(排名不分先后)...

    paney129 评论0 收藏0
  • JavaScript文章

    摘要:我对知乎前端相关问题的十问十答张鑫旭张鑫旭大神对知乎上经典的个前端问题的回答。作者对如何避免常见的错误,难以发现的问题,以及性能问题和不好的实践给出了相应的建议。但并不是本身有问题,被标准定义的是极好的。 这一次,彻底弄懂 JavaScript 执行机制 本文的目的就是要保证你彻底弄懂javascript的执行机制,如果读完本文还不懂,可以揍我。 不论你是javascript新手还是老...

    mumumu 评论0 收藏0
  • ES6-7

    摘要:的翻译文档由的维护很多人说,阮老师已经有一本关于的书了入门,觉得看看这本书就足够了。前端的异步解决方案之和异步编程模式在前端开发过程中,显得越来越重要。为了让编程更美好,我们就需要引入来降低异步编程的复杂性。 JavaScript Promise 迷你书(中文版) 超详细介绍promise的gitbook,看完再不会promise...... 本书的目的是以目前还在制定中的ECMASc...

    mudiyouyou 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<