下载文档原格式
JS核⼼知识梳理前⾔本⽂⽬标从JS的运⾏，设计，数据，应⽤四个⾓度来梳理JS核⼼的知识点主题⼤纲1. JS运⾏变量提升执⾏上下⽂作⽤域let作⽤域链闭包事件循环2. JS设计原型原型链thiscallapplybindnew继承3. JS数据数据类型数据的存储（深浅拷贝）数据类型判断（隐式转换，相等和全等，两个对象相等）数据的操作（数组遍历，对象遍历）数据的计算（计算误差）4. JS应⽤防抖，节流，柯⾥化⼀. JS运⾏⼤概分为四个阶段1. 词法分析：将js代码中的字符串分割为有意义的代码块，称为词法单元浏览器刚拿到⼀个JS⽂件或者⼀个script代码段的时候，它会认为⾥⾯是⼀个长长的字符串这是⽆法理解的，所以要分割成有意义的代码块，⽐如: var a = 12. 语法分析：将词法单元流转换成⼀颗抽象语法树(AST)，并对⽣成的AST树节点进⾏处理，⽐如使⽤了ES6语法，⽤到了let,const，就要转换成var。
为什么需要抽象语法树呢？抽象语法树是不依赖于具体的，不依赖于语⾔的细节，⽅便做很多的操作另⼀⽅⾯说，现在有许多语⾔，C，C++，Java，Javascript等等，他们有不同的语⾔规范但是转化成抽象语法树后就都是⼀致的了，⽅便编译器对其进⾏进⼀步的增删改查等操作，3. 预解析阶段：会确定作⽤域规则变量和函数提升4. 执⾏阶段：创建执⾏上下⽂，⽣成执⾏上下⽂栈执⾏可执⾏代码，依据事件循环1.作⽤域指定了函数和变量的作⽤范围分为全局作⽤域和函数作⽤域，JS不像C，JAVA语⾔⼀样，没有块级作⽤域,简单说就是花括号的范围2.变量和函数提升全局变量和函数声明会提升函数声明⽅式有三种，function foo() {}var foo = function () {}var foo = new Function()可归为两类，直接创建和变量赋值变量赋值函数和赋值普通变量的优先级按位置来，变量名相同前者被覆盖函数直接创建优先级⾼于变量赋值，同名取前者，与位置⽆关，也就是说函数直接创建即使再变量声明后⾯，也是优先级最⾼3. 执⾏上下⽂有不同的作⽤域，就有不同的执⾏环境，我们需要来管理这些上下⽂的变量执⾏环境分为三种，执⾏上下⽂对应执⾏环境全局执⾏环境函数执⾏环境eval执⾏环境（性能问题不提）1. 全局执⾏上下⽂先找变量声明，再找函数声明2. 函数执⾏上下⽂先找函数形参，和变量声明把实参赋值给形参找函数声明多个函数嵌套，就会有多个执⾏上下⽂，这需要执⾏上下⽂栈来维护，后进先出执⾏上下⽂⾥包含着变量环境和词法环境变量环境⾥就包含着当前环境⾥可使⽤的变量当前环境没有⽤哪的, 这就说到了作⽤域链4. 作⽤域链引⽤JS⾼程的定义：作⽤域链来保证对执⾏环境有权访问的变量和函数的有序访问变量的查找顺序不是按执⾏上下⽂栈的顺序，⽽是由词法作⽤域决定的词法作⽤域也就是静态作⽤域，由函数声明的位置决定，和函数在哪调⽤⽆关，也就js这么特殊5. 静态作⽤域和动态作⽤域词法作⽤域是在写代码或者定义时确定的⽽动态作⽤域是在运⾏时确定的（this也是！）var a = 2;function foo() {console.log(a); // 静态2 动态3}function bar() {var a = 3;foo();}bar();复制代码闭包由于作⽤域的限制，我们⽆法在函数作⽤域外部访问到函数内部定义的变量，⽽实际需求需要，这⾥就⽤到了闭包引⽤JS权威指南定义：闭包是指有权访问另⼀个函数作⽤域中的变量的函数1. 闭包作⽤for循环遍历进⾏事件绑定输出i值时为for循环的长度+1这结果显⽰不是我们想要的, 因为JS没有块级作⽤域，var定义的i值，没有销毁，存储与全局变量环境中在事件具体执⾏的时候取的i值，就是全局变量中经过多次计算后的i值for(var i = 0;i < 3;i++){document.getElementById(`item${i+1}`).onclick = function() {console.log(i);//3，3，3}}复制代码闭包特性：外部函数已经执⾏结束，内部函数引⽤外部函数的变量依然保存在内存中,变量的集合可称为闭包在编译过程中，对于内部函数，JS引擎会做⼀次此法扫描，如果引⽤了外部函数的变量，堆空间创建换⼀个Closure的对象,⽤来存储闭包变量利⽤此特性给⽅法增加⼀层闭包存储当时的i值，将事件绑定在新增的匿名函数返回的函数上for(var i = 0;i < 3;i++){document.getElementById(`item${i+1}`).onclick = make(i);}function make(e) {return function() {console.log(e)//0，1，2};复制代码闭包注意我们在不经意间就写成了闭包，内部函数引⽤外部函数的变量依然保存在内存中，该销毁的没有销毁，由于疏忽或错误造成程序未能释放已经不再使⽤的内存，就造成了内存泄漏同时注意闭包不会造成内存泄漏，我们错误的使⽤闭包才是内存泄漏事件循环JS代码执⾏依据事件循环JS是单线程，通过异步保证执⾏不被阻塞1. 执⾏机制简单说就是，⼀个执⾏栈，两个任务队列发现宏任务就放⼊宏任务队列，发现微任务就放⼊微任务队列，执⾏栈为空时，执⾏微任务队列所有微任务，再取宏任务队列⼀个宏任务执⾏如此循环2. 宏&微任务 macroTask: setTimeout, setInterval, I/O, UI rendering microTask: Promise.then⼆. JS设计1. 原型1. JS的设计有new操作符，构造函数，却没有类的概念，⽽是使⽤原型来模拟类来实现继承2. JS设计⼼路历程JS在设计之初，给的时间较短，并且定义为简单的⽹页脚本语⾔，不⽤太复杂，且想要模仿Java的理念，(这也是为什么JS叫JavaScript的原因)因此就借鉴了Java的对象、构造函数、new操作符理念，⽽抛弃掉了了复杂的class(类)概念3. 继承机制需要有⼀种继承的机制，来把所有对象联系起来，就可以使⽤构造函数但是构造函数⽣成实例对象的缺点就是⽆法共享属性和⽅法4. prototype属性为解决上⾯问题，就引⼊了prototype属性，就是我们常说的原型为构造函数设置⼀个prototype属性，实例对象需要共享的⽅法,都放在此对象上，整个核⼼设计完成后，后⾯的API也就顺理成章原型每⼀个js对象在创建的时候就会与之关联另⼀个对象这个对象就是原型，每个对象都会从原型继承属性proto每个对象都有⼀个属性叫proto,该属性指向对象的原型构造函数的prototype属性等于实例化对象的proto属性此属性并不是ES5 中的规范属性，只是为了在浏览器中⽅便获取原型⽽做的⼀个语法糖，我们可以使⽤Object.getPrototype()⽅法获取原型constructor 原型没有指向实例，因为⼀个构造函数可以有多个对象实例但是原型指向构造函数是有的，每个原型都有⼀个constructor属性指向关联的构造函数function Per() {} // 构造函数const chi = new Per() // 实例对象chi.__proto__ === Per.prototype // 获取对象的原型也是就构造函数的prototype属性Per.prototype.constructor === Per // constructor属性获取当前原型关联的构造函数复制代码实例与原型读取实例属性找不到时，就会查找与对象关联的原型的属性，⼀直向上查找，这种实例与原型之间的链条关系，这就形成了原型链function Foo() {} = 'tom'const foo = new Foo() = 'Jerry'console.log(); // Jerrydelete console.log(); // tom复制代码2.原型链⾸先亮出⼤家熟悉的⽹图就是实例与构造函数，原型之间的链条关系实例的 proto 指向原型构造函数的 prototype 属性指向原型原型的 constructor 属性指向构造函数所有构造函数的 proto 指向 Function.prototypeFunction.prototype proto 指向 Object.prototypeObject.prototype proto 指向 null函数对象原型（Function.prototype）是负责造构造函数的机器，包含Object、String、Number、Boolean、Array，Function。
js scroll方法JS scroll方法是JavaScript中用于实现滚动效果的方法。
通过scroll方法，我们可以控制网页元素在页面上的滚动行为，包括向上滚动、向下滚动等。
本文将详细介绍JS scroll方法的使用及其相关知识点。
一、基本概念滚动效果是指将网页内容的一部分或全部在视窗内滚动显示的效果。
当网页内容超出视窗大小时，我们可以通过滚动操作来查看被隐藏的内容。
JS scroll方法就是用来实现这种滚动效果的。
二、使用方法JS scroll方法可以通过以下两种方式进行调用：1. 通过元素对象调用，例如：element.scroll(x, y)；2. 通过window对象调用，例如：window.scroll(x, y)。
其中，x和y是指定滚动位置的水平和垂直坐标。
当指定为0时，表示滚动到顶部或左侧；当指定为元素的宽度或高度时，表示滚动到底部或右侧。
例如，element.scroll(0, 0)表示将元素滚动到顶部。
三、常见应用场景1. 页面导航：通过scroll方法可以实现点击导航菜单时页面平滑滚动到指定位置的效果，提升用户体验。
2. 无限滚动：通过监听滚动事件，当网页滚动到底部时，自动加载更多内容，实现无限滚动效果。
3. 轮播图：通过scroll方法和定时器可以实现自动滚动的轮播图效果，展示多张图片或广告。
四、注意事项1. scroll方法只能用于具有滚动条的元素，如div、iframe等，不能用于普通的文本或图片元素。
2. 在使用scroll方法时，需要注意元素的定位方式，通常需要设置元素的position属性为relative或absolute，以便正确计算滚动位置。
3. 在滚动到指定位置后，可以使用scrollTop和scrollLeft属性获取滚动位置，以便进行进一步的操作。
五、示例代码下面是一个简单的示例代码，演示了如何使用JS scroll方法实现页面导航的滚动效果：```html<!DOCTYPE html><html><head><style>#content {height: 1000px;overflow: auto;}#section1, #section2, #section3 { height: 500px;}</style></head><body><div id="content"><div id="section1"><h1>Section 1</h1><p>This is section 1.</p></div><div id="section2"><h1>Section 2</h1><p>This is section 2.</p></div><div id="section3"><h1>Section 3</h1><p>This is section 3.</p></div></div><script>var navLinks = document.querySelectorAll('a');var sections = document.querySelectorAll('div');for (var i = 0; i < navLinks.length; i++) {navLinks[i].addEventListener('click', function(e) {e.preventDefault();var target = document.querySelector(this.getAttribute('href'));window.scroll({top: target.offsetTop,behavior: 'smooth'});});}</script></body></html>```在上述示例代码中，我们使用了一个包含多个div元素的父容器content，并为每个div元素添加了一个id属性作为锚点。
js知识点总结基础一、基础知识1. 数据类型：JavaScript的数据类型分为基本数据类型和复杂数据类型。
基本数据类型包括数字、字符串、布尔值、null和undefined。
复杂数据类型包括对象、数组和函数。
2. 变量和常量：在JavaScript中，可以使用var、let和const来声明变量。
使用var声明的变量可以是全局变量或局部变量，而使用let声明的变量只能在其声明的块级作用域内有效。
使用const声明的变量是常量，其值无法被修改。
3. 运算符：JavaScript支持算术运算符、比较运算符、逻辑运算符和位运算符等。
4. 控制流程：JavaScript支持if语句、switch语句、while循环、do-while循环和for循环等控制流程语句。
5. 函数：JavaScript中的函数是一等公民，可以作为变量传递、作为对象的属性以及作为函数的返回值。
函数可以声明为函数表达式、箭头函数和构造函数。
6. 对象和数组：JavaScript中的对象是一种无序的键值对集合，可以用来描述现实世界中的实体。
数组是一种有序的值的集合，可以通过索引来访问数组中的元素。
二、面向对象编程1. 原型和原型链：JavaScript中的所有对象都有一个原型对象，原型对象有一个指向它的原型的引用。
通过原型链，可以实现对象之间的继承关系。
2. 构造函数和原型对象：构造函数是一种特殊的函数，可以用来创建对象。
通过构造函数和原型对象，可以实现面向对象编程中的封装和继承。
3. 类和对象：ES6引入了class关键字，可以用来定义类。
类可以用来创建对象，并且可以实现面向对象编程中的封装、继承和多态。
三、异步编程1. 回调函数：JavaScript中的异步编程通常使用回调函数来实现。
回调函数是一种可以被传递给其他函数的函数，用来在异步操作完成后执行特定的代码。
2. Promise对象：Promise是一种用来处理异步操作的对象，可以将异步操作和它们的结果进行抽象和封装。
web前端考试知识点总结一、HTML知识点总结1. HTML基础知识- HTML的基本结构- HTML的常用标签- HTML的元数据标签- HTML的列表、表格、表单等相关标签2. HTML5新增的语义化标签- header、footer、nav、article、section、aside等3. HTML5新增的表单元素- input的各种类型- 新增的表单元素如datalist、keygen等4. HTML5新增的媒体元素- video、audio等5. HTML5新增的API- 本地存储、离线应用、地理定位等二、CSS知识点总结1. CSS基础知识- CSS的语法- CSS的选择器- CSS的样式属性2. CSS布局- 盒模型- 浮动- 定位- 弹性盒子布局- 栅格布局3. CSS3新增的样式- 边框、背景、文字、渐变、阴影等效果 - 过渡、变换、动画等4. 响应式设计- 媒体查询- 移动优先5. CSS预处理器- SASS、LESS等三、JavaScript知识点总结1. JavaScript基础知识- 数据类型- 运算符- 流程控制语句2. JavaScript函数- 函数的定义- 作用域- 闭包- 高阶函数3. JavaScript对象- 对象的创建- 原型链- 对象的继承4. DOM操作- 节点的增删改查- 事件处理5. AJAX与跨域- XMLHttpRequest对象- 跨域访问的解决方案6. ES6知识点- let、const- 箭头函数- 解构赋值- 模板字符串- Promise等四、Web前端知识点总结1. 前端框架- Vue.js、React、Angular等- 每个框架的基本原理和使用方法2. 前端工程工具- Webpack、Gulp、Grunt等- 理解构建工具的作用和配置3. 前端性能优化- 页面加载速度优化- 代码性能优化4. 前端安全- XSS、CSRF、点击劫持等- 前端安全常见问题和解决方案5. 前端测试- 单元测试- UI测试6. 前端工程化- 模块化开发- 前端构建流程综上所述，Web前端技术知识点之多之杂，要想在考试中取得好成绩，需要对各种知识点进行深入理解和掌握。
flv.js源码知识点引言f l v.js是一个用于解析和播放F LV格式视频的Ja va Sc rip t库。
本文将对f lv.j s的源码进行详细的分析和解读，帮助读者更好地理解和应用该库。
文章包含以下内容：fl v.js的概述、主要模块的介绍、源码的关键知识点以及一些实际案例的讨论。
概述f l v.js是一个开源的J av aS cr ip t库，用于在W eb浏览器中播放F L V格式的视频文件。
它采用纯J av aS cr i pt实现，不依赖于F la sh技术或其他插件，具有良好的跨平台兼容性。
主要模块介绍f l v.js主要由以下几个模块组成：1.解析模块：负责解析FL V文件的头部信息、标签和帧数据。
2.控制模块：管理视频的播放、暂停、跳转等操作。
3.渲染模块：将解析后的视频帧数据渲染到HT ML5的画布上，实现视频的显示。
4.编解码模块：负责对音视频数据进行解码或编码，以及处理视频的音轨切换和字幕显示。
源码知识点1.F L V文件格式f l v.js的源码中包含了对F LV文件格式的解析逻辑。
F LV文件由F LV 头部、大量的Ta g和多个A ud io和V id e o帧组成。
了解FL V文件的结构对于理解源码非常重要。
2.标签(T a g)标签是F LV文件中的基本单位，它包含了音视频数据以及与之相关的时间戳等信息。
f lv.j s对标签的解析和处理是整个源码的核心部分。
3.帧数据帧数据是标签中的音频、视频等实际数据。
f lv.j s通过解析F L V文件中的帧数据，并使用相应的解码器对其进行解码，然后渲染到画布上。
4.控制与交互f l v.js提供了一系列的A PI，使得开发者可以对视频进行控制和交互。
例如，可以通过A PI实现视频的播放、暂停、跳转、音轨切换、字幕显示等功能。
案例讨论案例一：视频播放控制f l v.js的源码提供了播放器的基本功能，包括播放、暂停、跳转等操作。
DAY01：一、基本特点：1、JavaScript是一种属于网络的脚本语言,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果。
通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的。
2、是一种解释性脚本语言（代码不进行预编译）。
3、主要用来向HTML（标准通用标记语言下的一个应用）页面添加交互行为。
4、可以直接嵌入HTML页面，但写成单独的js文件有利于结构和行为的分离。
5、跨平台特性，在绝大多数浏览器的支持下，可以在多种平台下运行（如Windows、Linux、Mac、Android、iOS等）。
6、avascript脚本语言同其他语言一样，有它自身的基本数据类型，表达式和算术运算符及程序的基本程序框架。
Javascript提供了四种基本的数据类型和两种特殊数据类型用来处理数据和文字。
而变量提供存放信息的地方，表达式则可以完成较复杂的信息处理。
二、日常用途：1、嵌入动态文本于HTML页面。
2、对浏览器事件做出响应。
3、读写HTML元素。
4、在数据被提交到服务器之前验证数据。
5、检测访客的浏览器信息。
6、控制cookies，包括创建和修改等。
7、基于技术进行服务器端编程。
DAY02：javascript的放置和注释1.输出工具();("","")如何在html页面当中进行放置A.<script></script>***************************************javascript可以在html页面当中的任何位置来进行调用，但是他们还是一个整体，是相互联系，相互影响。
***************************************B.可以在超链接或是重定向的位置调用javascript代码格式："javascript:alert('我是超链接')"重定向格式：action="javascript:alert('我是表单')"3.在事件后面进行调用A.格式：onclick="alert('我是事件')"B.<scriptfor="two"event="onclick">alert("我是DIV2");</script>4.调用外部javascript文件格式：<scriptsrc=""></script>******************************************************************* 在调用页面<script>标签对当中不能有任何代码在js脚本中不能出现<script>标签对但是他们还是一个整体，是相互联系，相互影响。
js 后端返回的二进制-概述说明以及解释1.引言1.1 概述概述部分的内容如下：在现代的网络开发中，我们经常会遇到需要与后端进行数据交互的情况。
而后端返回的数据往往以文本的形式传输，如JSON或HTML等。
然而，有时候我们也会遇到后端返回的是二进制数据的情况。
二进制数据是一种由0和1组成的数据形式，它与文本数据有着本质的区别。
与文本数据不同的是，二进制数据是以字节(byte)为单位进行存储和传输的。
这种数据形式在某些场景下可以提供更高的效率和更多的功能。
本文将深入探讨后端返回的二进制数据在前端开发中的作用和应用场景。
我们将介绍什么是二进制数据，以及它与文本数据之间的区别。
我们还将详细探讨如何处理后端返回的二进制数据，包括如何解析和处理这些数据，以及如何将其展示给用户。
通过本文的学习，读者将能够更好地理解后端返回的二进制数据的重要性，并能够将其应用于自己的项目中。
无论是处理图像、音频还是视频等多媒体数据，亦或是与硬件设备进行通信，后端返回的二进制数据都能为开发者提供更多的选择和灵活性。
总而言之，本文将围绕后端返回的二进制数据展开讨论，为读者提供深入的理论知识和实践技巧。
通过学习本文，读者将能够更加深入地了解如何处理后端返回的二进制数据，并能够运用这些知识解决实际问题。
让我们一起深入探索吧！1.2 文章结构文章结构部分主要描述了本文所使用的章节结构以及各个章节的内容概要，以便读者能够清晰地了解整篇文章的组织框架。
文章结构的章节安排如下：2.正文2.1 什么是二进制数据2.2 后端返回的二进制数据的作用2.3 如何处理后端返回的二进制数据在本文的正文部分，将介绍与js后端返回的二进制数据相关的内容，主要包括三个章节。
首先，我们将解释什么是二进制数据，包括其基本概念和特点。
接着，我们会探讨后端返回的二进制数据在实际应用中的作用，以及它为开发者带来的好处和应用场景。
最后，我们将介绍如何处理后端返回的二进制数据，包括解码和解析等操作，以及常用的处理方法和工具。
js基础知识点js基础知识点1、javascript概述JavaScript是一种弱类型，以对象为基础，定义的脚本语言，它可以给网页添加各种动态特性，JavaScript不需要编译就能运行，有丰富的内置函数和对象，可以在Web中读写数据，用于在Web中编写客户端脚本。
2、javascript应用JavaScript可以用在各种浏览器上，可以实现网页中的事件处理、表单处理、客户端检验、图形界面效果等。
通常JavaScript使用的目的是增强用户体验，提高网页的交互性和可用性3、javascript变量JavaScript变量有全局变量和局部变量。
它们的区别在于：1）全局变量在JavaScript脚本的所有部分都可以访问，而局部变量只能在声明它的函数内部访问。
2）局部变量只在函数内部有效，函数外部无法访问，而全局变量在函数内部外部都可以访问。
3）全局变量在整个网页的所有脚本都可以访问，只要这个网页被打开就可以，而局部变量只能在它声明的函数或语句块内访问。
4、javascript数据类型JavaScript支持6种数据类型：Undefined、Null、Boolean、Number、String 和Object。
Undefined 表示未定义，它的值是undefined。
Null 表示空值，它的值是null。
Boolean 表示布尔值，它的值是true或false。
Number表示数字，它的值是整数或小数String 表示字符串，它的值是由一系列字符组成的文本Object 表示对象，它的值是一组数据和功能的集合5、javascript函数JavaScript函数可以看作是一段可以重复使用的代码，它由一系列语句组成，用于完成特定的任务。
函数有四个特点：1）可以重复使用2）可以接收参数3）可以返回值4）可以封装函数的声明和调用函数可以使用function来声明：function functionName (parameters) {// code to be executed}函数使用functionName()来调用：functionName(parameters);函数默认有返回值，如果使用return语句来返回值，则忽略默认值，否则，函数返回值为undefined。
vue3必背100个知识Vue.js3是一个流行的JavaScript框架，用于构建用户界面。
以下是一些关于Vue.js 3的必背知识点，包括基本概念、指令、组件和其它重要方面：###基础概念1.Vue实例的创建和生命周期钩子。
2.数据绑定和插值表达式。
3.条件渲染和列表渲染。
4.事件处理和方法。
5.计算属性和侦听器。
6.Class和Style绑定。
7.表单输入绑定和双向数据绑定。
8.生命周期钩子函数的执行顺序。
###Vue指令9.v-if、v-else-if和v-else指令。
10.v-for指令的用法。
11.v-show指令的作用。
12.v-bind和缩写语法。
13.v-on和缩写语法。
14.v-model指令的使用。
15.v-pre、v-cloak和v-once指令。
###组件16.组件的创建和使用。
17.组件的Props传递。
18.组件的事件传递。
19.插槽的使用。
20.动态组件的实现。
21.组件的生命周期。
22.异步组件的加载。
23.组件的ref属性。
24.Vuex状态管理的基本使用。
###Vue3新特性position API的使用。
26.Teleport组件的作用。
27.新的响应式API（`reactive`、`ref`、`toRefs`）。
28.Setup函数的作用。
29.`defineProps`和`defineEmits`的使用。
###路由和导航30.Vue Router的基本使用。
31.路由参数的获取。
32.命名路由的使用。
33.编程式导航的实现。
34.路由导航守卫的理解。
###状态管理35.Vuex的基本概念。
36.State、Getters、Mutations和Actions的使用。
37.模块化的Vuex应用。
###HTTP请求38.使用Axios进行HTTP请求。
39.在Vue中使用Fetch API。
###过渡和动画40.过渡的基本使用。
41.列表过渡的实现。
42.动画的使用。
JavaScript基础知识点1、JavaScript概述1.1、JavaScript是什么？有什么⽤？HTML：就是⽤来写⽹页的。
⼈的⾝体CSS：就是⽤来美化页⾯的。
⼈的⾐服JavaScript：前端⼤脑、灵魂。
⼈的⼤脑、灵魂JavaScript是WEB上最强⼤的脚本语⾔。
脚本语⾔：⽆法独⽴执⾏。
必须嵌⼊到其它语⾔中，结合使⽤。
直接被浏览器解析执⾏。
Java编程语⾔：独⽴写程序、独⽴运⾏。
先编译后执⾏作⽤：控制页⾯特效展⽰。
例如：JS可以对HTML元素进⾏动态控制JS可以对表单项进⾏校验JS可以控制CSS的样式1.2、JavaScript⼊门案例1.3、JavaScript的语⾔特征及编程注意事项特征：JavaScript⽆需编译，直接被浏览器解释并执⾏JavaScript⽆法单独运⾏，必须嵌⼊到HTML代码中运⾏JavaScript的执⾏过程由上到下依次执⾏注意：JavaScript没有访问系统⽂件的权限（安全）由于JavaScript⽆需编译，是由上到下依次解释执⾏，所以在保持可读性的情况下，允许使⽤链式编程JavaScript和java没有任何直接关系1.4、JavaScript的组成JavaScript包括：ECMAScript 、 DOM 、 BOMECMAScript（核⼼）：规定了JS的语法和基本对象。
DOM ⽂档对象模型：处理页⾯内容的⽅法标记型⽂档。
HTMLBOM 浏览器对象模型：与浏览器交互的⽅法和接⼝1.4.1、内部脚本在当前页⾯内部写script标签，内部即可书写JavaScript代码格式：<script type="text/javascript"> JavaScript的代码 </script>注：script标签理论上可以书写在HTML⽂件的任意位置1.4.2、外部引⼊在HTML⽂档中，通过<script src="">标签引⼊.js⽂件格式：<script type="text/javascript" src="javascript⽂件路径"></script>⽰例⼀：<script type="text/javascript" src="01demo1.js"></script>注：外部引⽤时script标签内不能有script代码，即使写了也不会执⾏。
javascript知识点JavaScript（简称“JS”）是一种直译式脚本语言，是一种动态类型的、弱类型的、基于原型的语言，内置支持类型。
它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML 网页增加动态功能。
JavaScript知识点包括：1、JavaScript 核心：JavaScript 是一种脚本语言，它支持面向对象的编程，也支持函数式编程，以及命令式编程等多种风格。
JavaScript 的核心包括：语法、变量、运算符、表达式、关键字、语句、注释和函数。
2、DOM（文档对象模型）：DOM 将 HTML 文档分解成一系列可访问的节点，它们可以使用 JavaScript 来操作，例如添加、删除、修改和查找元素。
3、BOM（浏览器对象模型）：BOM 提供了一系列的API，用于访问浏览器的特性，例如窗口、导航历史、计时器等，可以使用 JavaScript 来操作。
4、Ajax：Ajax 是一种异步的 Web 开发技术，可以使用 JavaScript 和 XMLHttpRequest 对象来访问服务器，从而实现异步数据交互和更新网页内容。
5、jQuery: jQuery 是一套前端 JavaScript 库，可以通过简单的 API 来操作 DOM，实现动画效果、事件处理、Ajax 交互等。
6、Node.js：Node.js 是一个基于 JavaScript 语言的服务端开发平台，可以使用 JavaScript 编写服务端应用程序，并且可以与浏览器端的 JavaScript 代码共享同一种 API。
7、AngularJS：AngularJS 是一个前端 JavaScript 框架，可以使用 AngularJS 快速开发 Web 应用，它拥有模块、控制器、视图、指令等概念，使得前端开发变得更加容易。
NodeJS基础什么是NodeJSJS是脚本语言，脚本语言都需要一个解析器才能运行。
对于写在HTML页面里的JS，浏览器充当了解析器的角色。
而对于需要独立运行的JS，NodeJS就是一个解析器。
每一种解析器都是一个运行环境，不但允许JS定义各种数据结构，进行各种计算，还允许JS使用运行环境提供的内置对象和方法做一些事情。
例如运行在浏览器中的JS的用途是操作DOM，浏览器就提供了document之类的内置对象。
而运行在NodeJS中的JS的用途是操作磁盘文件或搭建HTTP服务器，NodeJS 就相应提供了fs、http等内置对象。
有啥用处尽管存在一听说可以直接运行JS文件就觉得很酷的同学，但大多数同学在接触新东西时首先关心的是有啥用处，以及能带来啥价值。
NodeJS的作者说，他创造NodeJS的目的是为了实现高性能Web服务器，他首先看重的是事件机制和异步IO模型的优越性，而不是JS。
但是他需要选择一种编程语言实现他的想法，这种编程语言不能自带IO功能，并且需要能良好支持事件机制。
JS没有自带IO功能，天生就用于处理浏览器中的 DOM事件，并且拥有一大群程序员，因此就成为了天然的选择。
如他所愿，NodeJS在服务端活跃起来，出现了大批基于NodeJS的Web服务。
而另一方面，NodeJS让前端众如获神器，终于可以让自己的能力覆盖范围跳出浏览器窗口，更大批的前端工具如雨后春笋。
因此，对于前端而言，虽然不是人人都要拿NodeJS写一个服务器程序，但简单可至使用命令交互模式调试JS代码片段，复杂可至编写工具提升工作效率。
NodeJS生态圈正欣欣向荣。
如何安装安装程序NodeJS提供了一些安装程序，都可以在这里下载并安装。
Windows系统下，选择和系统版本匹配的.msi后缀的安装文件。
Mac OS X系统下，选择.pkg后缀的安装文件。
编译安装Linux系统下没有现成的安装程序可用，虽然一些发行版可以使用apt-get之类的方式安装，但不一定能安装到最新版。
前端技术开发考试必备知识点一、HTML（超文本标记语言）1. 基本结构。
- `<!DOCTYPE html>`：声明文档类型为HTML5。
- `<html>`标签：整个HTML文档的根标签，包含`<head>`和`<body>`。
- `<head>`：包含文档的元数据，如`<title>`（设置网页标题）、`<meta>`（用于描述网页的各种信息，如字符编码`<meta charset = "UTF - 8">`）等。
- `<body>`：包含网页的可见内容，如文本、图像、链接等。
2. 标签类型。
- 块级标签：如`<div>`（用于划分页面区域）、`<p>`（段落）等，默认占据一行，可设置宽度、高度等属性。
- 行内标签：如`<span>`（用于包裹行内元素）、`<a>`（链接）等，在一行内显示，宽度由内容撑开。
3. 常用标签。
- `<img>`：用于插入图像，属性有`src`（图像的源地址）、`alt`（图像的替代文本，当图像无法显示时显示）。
- `<input>`：用于创建表单输入元素，类型有`text`（文本输入）、`password`（密码输入）、`radio`（单选按钮）、`checkbox`（复选框）等。
- `<select>`和`<option>`：用于创建下拉菜单，`<select>`是容器，`<option>`是菜单中的选项。
二、CSS（层叠样式表）1. 引入方式。
- 内联样式：在HTML标签内使用`style`属性，如`<div style = "color: red; font - size: 16px;">`。
JavaScript框架比较知识点JavaScript是一门广泛应用于web开发的脚本语言，它可以使网页变得具有交互性和动态性。
为了简化开发过程和提高代码的可维护性，许多JavaScript框架应运而生。
本文将对几个常用的JavaScript框架进行比较，以帮助我们选择适合自己项目需求的框架。
一、React.jsReact.js是由Facebook开发的一款JavaScript库，被用于构建用户界面。
它采用了组件化的开发模式，可以将页面划分为一个个独立的组件，通过组件间的数据传递和渲染，实现了模块化的开发。
React.js具有以下特点：1.虚拟DOM：React.js通过使用虚拟DOM，可以在每次状态变化时，只更新变化的部分，从而提高了性能。
2.组件化开发：React.js的组件化开发模式，可以使代码更易于管理和维护。
3.生态系统：React.js拥有庞大的生态系统，有大量开源组件和库可以使用。
二、Vue.jsVue.js是一款由尤雨溪开发的JavaScript框架，也用于构建用户界面。
Vue.js借鉴了Angular和React的一些概念，并根据自身的理念进行了优化。
以下是Vue.js的特点：1.易学易用：Vue.js采用了简洁的语法，学习曲线较为平缓。
同时，它也提供了丰富的指令和组件，方便开发者使用。
2.响应式数据绑定：通过Vue.js的数据绑定机制，可以轻松实现数据与视图的自动同步。
3.组件化开发：Vue.js同样支持组件化开发，提供了更好的代码复用性和可维护性。
三、Angular.jsAngular.js是Google开发的一款JavaScript框架，用于构建动态web 应用程序。
Angular.js是一种完整的MVC框架，并且具有以下特点：1.强大的功能集：Angular.js拥有许多内置功能，包括数据绑定、路由、模板、依赖注入等，方便开发者快速构建复杂的应用程序。
2.双向数据绑定：Angular.js通过双向数据绑定，可以实现数据的自动同步，减少开发者的手动操作。
vue面试知识点总结Vue.js 是一种轻量级的JavaScript框架，用于构建交互式Web界面。
它使得开发者可以轻松地构建单页Web应用，同时也可以作为Web应用的视图层，与其它库和工具结合使用。
在现代Web开发中，Vue.js 已经成为了最流行的前端框架之一，并且也是很多前端开发工程师的首选。
在进行Vue.js的面试时，了解Vue.js的核心概念和一些高级特性是非常重要的。
以下是一些可能在Vue.js面试中被问到的知识点：Vue.js基础知识：1. 什么是Vue.js？它的特点是什么？答：Vue.js是一个渐进式JavaScript框架，用于构建交互式Web界面。
它具有轻量、易上手、高效和灵活等特点。
2. Vue.js的两大核心特性是什么？答：数据驱动和组件化是Vue.js的两大核心特性。
数据驱动指的是视图会自动更新，因为数据的变化；组件化指的是将页面拆分为多个独立可复用的组件。
3. 介绍一下Vue的生命周期钩子函数。
答：Vue实例有8个生命周期钩子函数，分别是beforeCreate、created、beforeMount、mounted、beforeUpdate、updated、beforeDestroy、destroyed。
这些生命周期钩子函数可以让我们在Vue实例的不同阶段执行一些操作。
4. 什么是Vue组件？如何定义一个Vue组件？答：Vue组件是Vue.js中最强大的特性之一，可以将页面的一部分封装成一个独立可复用的组件。
定义一个Vue组件可以使用ponent()方法，或者使用单文件组件（.vue文件）的方式。
5. 如何在Vue中进行父子组件间通信？答：Vue中父子组件之间的通信可以通过props和$emit实现。
父组件可以通过props向子组件传递数据，而子组件可以通过$emit触发父组件的事件。
Vue.js高级知识：1. 什么是Vuex？它的作用是什么？答：Vuex是Vue.js的状态管理模式，它可以帮助我们管理应用中的各种状态。
Nodejs-cluster模块知识点总结及实例⽤法⾯试官有时候会问你，你给我说下nodejs如何开启多进程哇，你脑海⾥就应该⽴刻出现cluster模块，如今让我带你去探讨下cluster模块的使⽤。
基本⽤法Node.js默认单进程运⾏，对于32位系统最⾼可以使⽤512MB内存，对于64位最⾼可以使⽤1GB内存。
对于多核CPU的计算机来说，这样做效率很低，因为只有⼀个核在运⾏，其他核都在闲置。
cluster模块就是为了解决这个问题⽽提出的。
cluster模块允许设⽴⼀个主进程和若⼲个worker进程，由主进程监控和协调worker进程的运⾏。
worker之间采⽤进程间通信交换消息，cluster模块内置⼀个负载均衡器，采⽤Round-robin算法协调各个worker进程之间的负载。
运⾏时，所有新建⽴的链接都由主进程完成，然后主进程再把TCP连接分配给指定的worker进程。
var cluster = require('cluster');var os = require('os');if (cluster.isMaster){for (var i = 0, n = os.cpus().length; i < n; i += 1){cluster.fork();}} else {http.createServer(function(req, res) {res.writeHead(200);res.end("hello world\n");}).listen(8000);}上⾯代码先判断当前进程是否为主进程（cluster.isMaster），如果是的，就按照CPU的核数，新建若⼲个worker进程；如果不是，说明当前进程是worker进程，则在该进程启动⼀个服务器程序。
上⾯这段代码有⼀个缺点，就是⼀旦work进程挂了，主进程⽆法知道。
为了解决这个问题，可以在主进程部署online事件和exit事件的监听函数。
JS知识点总结一、对象1、JS的本地对象和内置对象Array创建Array对象的语法：new Array();new Array(size);new Array(element0,element1,element2,...elementn);属性：constructorlength属性可设置或返回数组中元素的数目arrayObject.length;prototype方法：concat();方法用于连接两个或多个数组arrayObject.concat(arrayX,arrayX,...,arrayX);join();方法用于把数组中的所有元素放入一个字符串。
arrayObject.join(separator);pop();方法用于删除并返回数组的最后一个元素arrayObject.pop();push();方法可向数组的末尾添加一个或多个元素，并返回新的长度arrayObject.push(newelement1,newelement2,...,newelementn) ;reverse();方法用于颠倒数组中元素的顺序arrayObject.reverse();shift();方法用于把数组的第一个元素从其中删除，并返回第一个元素的值arrayObject.shift();slice();方法可从已有的数组中返回选定的元素arrayObject.slice(start,end);sort();方法用于对数组的元素进行排序arrayObject.sort(sortby);sortby规定排序顺序，必须是函数splice();方法向/从数组中添加/删除项目，然后返回被删除的项目arrayObject.splice(index,howmany,item1,...,itemX);toSource();toString();toLocaleString();将数组转为本地字符串arrayObject.toLocaleString();unshift();方法可向数组的开头添加一个或更多元素，并返回新的长度arrayObject.unshift(newelement1,...newelementn);valueOf();Boolean创建Boolean对象的语法:new Boolean(value);Boolean(value);属性：Constructor属性返回对创建此对象的Boolean函数的引用Object.constructorPrototype属性使您有能力向对象添加属性和方法=value;方法：toSource();方法返回表示对象源代码的字符串Object.toSource();toString();方法可把一个逻辑值转为字符串，并返回结果booleanObject.toString();valueOf();方法返回Boolean对象的原始值booleanObject.valueOf();Date创建Date对象的语法var mydate=new Date();属性：constructorprototype方法：Date();方法可返回当天的日期和时间getDate();方法可返回月份的某一天getDay();方法可返回表述星期的某一天的数字getMonth();方法可返回表示月份的数字getFullYear();方法可返回一个表示年份的4位数字getYear();方法可返回表示年份的两位或四位数字，使用上面的方法替代getHours();方法返回时间的小时字段getMinutes();方法返回时间的分钟字段getSeconds();方法返回时间的秒getMilliseconds();方法返回时间的毫秒getTime();方法可返回距1970年1月1日之间的毫秒数getTimezoneOffset();方法可返回格林威治时间和本地时间之间的时差，以分钟为单位getUTCDate();getUTCDay();getUTCMonth();getUTCFullYear();getUTCHours();getUTCMinutes();getUTCSeconds();getUTCMilliseconds();parse();方法可解析一个日期时间字符，并返回1970/1/1午夜距离该日期时间的毫秒数setDate();setMonth();setFullYear();setYear();setHours();setMinutes();setSeconds();setMilliseconds();setTime();setUTCDate();setUTCMonth();setUTCFullYear();setUTCHours();setUTCMinutes();setUTCSeconds();setUTCMilliseconds();toSource();toString();toTimeString();方法可把Date对象的时间部分转换为字符串，并返回结果toDateString();方法可把Date对象的日期部分转换为字符串，并返回结果toGMTString();toUTCString();toLocaleString();toLocaleTimeString();toLocaleDateString();UTC();方法可根据世界时返回1970/1/1到指定日期的毫秒数Date.UTC(year,month,day,hours,minutes,seconds,ms);valueOf();MathMath对象用于执行数学任务使用Math的属性和方法的语法：var pi_value=Math.PI;var sqrt_value=Math.sqrt(15);属性：E:返回算术常量e，即自然数对数的底数（约等于2.718）LN2:返回2的自然对数LN10:返回10的自然对数LOG2E:返回以2为底的e的对数LOG10E:返回以10为底的e的对数PI:返回圆周率SQRT1_2:返回2的平方根的倒数SQRT2:返回2的平方根方法：abs(x);返回数的绝对值acos(x);返回数的反余弦值asin(x);返回数的反正弦值atan(x);以介于-PI/2与PI/2弧度之间的数值来返回x的反正切值atan2(y,x);返回从x轴到点(x,y)的角度(介于-PI/2与PI/2弧度之间)ceil(x);对数进行上舍入cos(x);返回数的余弦exp(x);返回e的指数floor(x);对数进行下舍入log(x);返回数的自然对数(底为e)max(x,y);返回x和y中的最大值min(x,y);返回x和y中的最小值pow(x,y);返回x的y次幂random();返回0～1之间的随机数round(x);把数四舍五入为最接近的整数sin(x);返回数的正弦sqrt(x);返回数的平方根tan(x);返回角的正切toSource();返回该对象的源代码valueOf();返回Math对象的原始值Number创建Number对象的语法var mynum=new Number(value);var mynum=Number(value);属性:constructor:返回对创建此对象的Number函数的应用MAX_VALUE:可表示的最大数MIN_VALUE:可表示的最小数NaN:非数字值NEGATIVE_INFINITY:负无穷大，溢出时返回该值POSITIVE_INFINITY:正无穷大，溢出时返回该值Prototype:使您有能力向对象添加属性和方法方法:toString();toLocaleString();toFixed();方法可把Number四舍五入为指定小数位数的数字toExponential();方法把对象的值转换成指数计数法toPrecision();方法可在对象的值超出指定位数时将其转换为指数计数法valueOf();StringString对象用于处理文本（字符串）创建String对象的语法：new String(s);String(s);属性:constructorlength:字符串的长度prototype方法:anchor();方法用于创建HTML锚stringObject.anchor(anchorname);big();方法用于把字符串显示为大号字体blink();方法用于显示闪动的字符串bold();方法用于把字符串显示为粗体charAt();方法可返回指定位置的字符stringObject.charAt(index);charCodeAt();方法可返回指定位置的字符的Unicode编码concat();方法用于连接两个或多个字符串fixed();方法用于把字符串显示为打字机字体fontcolor();方法用于按照指定的颜色来显示字符串fontsize();方法用于按照指定的尺寸来显示字符串fromCharCode();可接受一个或多个指定的Unicode值，然后返回一个字符串indexOf();方法可返回某个指定的字符串值在字符串中首次出现的位置italics();使用斜体字显示字符串lastIndexOf();从后向前搜索字符串link();将字符串显示为链接localeCompare();用本地特定的顺序来比较两个字符串match();找到一个或多个正则表达式的匹配replace();替换与正则表达式匹配的子串search();检索与正则表达式相匹配的值slice();提取字符串的片段，并在新的字符串中返回被提取的部分small();使用小字号来显示字符串split();把字符串分割为字符数组strike();使用删除线来显示字符串sub();把字符串显示为下标substr();从起始索引号提取字符串中指定数目的字符substring();提取字符串中两个指定的索引号之间的字符sup();把字符串显示为上标toLocaleLowerCase();把字符串转换为小写toLocaleUpperCase();把字符串转换为大写toLowerCase();toUpperCase();toSource();toString();valueOf();RegExpRegExp对象表示正则表达式，它是对字符串执行模式匹配的强大工具直接量语法/pattern/attributes创建RegExp对象的语法：new RegExp(pattern,attributes);修饰符i:执行对大小写不敏感的匹配g:执行全局匹配m:执行多行匹配方括号用于查找某个范围内的字符[abc]:查找方括号之间的任何字符[^abc]:查找任何不在方括号之间的字符[0-9]:查找任何从0-9的数字[a-z]:查找任何从小写a到小写z的字符[A-Z]:查找任何大写A到大写Z的字符[A-z]:查找任何从大写A到小写z的字符[adgk]:查找给定集合内的任何字符[^adgk]:查找给定集合外的任何字符[red|blue|green]:查找任何指定的选项元字符元字符是拥有特殊含义的字符.:查找单个字符，除了换行和行结束符\w:查找单词字符\W:查找非单词字符\d:查找数字\D:查找非数字\s:查找空白字符\S:查找非空白字符\b:匹配单词边界\B:匹配非单词边界\0:查找NUL字符\n:查找换行符\f:查找换页符\r:查找回车符\t:查找制表符\v:查找垂直制表符\xxx:查找以八进制数xxx规定的字符\xdd:查找以十六进制数dd规定的数字\uxxxx:查找以十六进制数xxxx规定的Unicode字符量词n+:匹配任何包含至少一个n的字符串n*:匹配任何包含零个或多个n的字符串n?:匹配任何包含零个或一个n的字符串n{x}:匹配包含x个n的序列的字符串n{x,y}:匹配包含x至y个n的序列的字符串n{x,}:匹配包含至少x个n的序列的字符串n$:匹配任何结尾为n的字符串^n:匹配任何开头为n的字符串?=n:匹配任何其后紧接指定字符串n的字符串?!n:匹配任何气候没有紧接指定字符串n的字符串属性：global:RegExp对象是否具有标志gignoreCase:RegExp对象是否具有标志ilastIndex:一个整数，标识开始下一次匹配的字符位置multiline:RegExp对象是否具有标志msource:正则表达式的源文本方法：compile:编译正则表达式exec:方法用于检索字符串中的正则表达式的匹配test:方法用于检测一个字符串是否匹配某个模式Global全局属性和函数可用于所有内建的JavaScript对象顶层函数（全局函数）decodeURI();解码某个编码的URIdecodeURIComponent();解码一个编码的URI组件encodeURI();把字符串编码为URIencodeURIComponent();把字符串编码为URI组件escape();对字符串进行编码eval();计算JavaScript字符串，并把它作为脚本代码来执行getClass();返回一个JavaObject的JavaClassisFinite();检查某个值是否为有穷大的数isNaN();检查某个值是否是数字Number();把对象的值转换为数字parseFloat();解析一个字符串并返回浮点数parseInt();解析一个字符串并返回一个整数String();把对象的值转换为字符串Unescape();对由escape()编码的字符串进行解码顶层属性（全局属性）Infinity:代表正的无穷大的数值java:代表java.*包层级的一个JavaPackageNaN:指示某个值是不是数字Packages:根JavaPackage对象undefined:指示未定义的值Events事件通常与函数配合使用，这样就可以通过发生的事件来驱动函数执行事件句柄onabort:图像加载被中断onblur:元素失去焦点onchange:用户改变域的内容onclick:鼠标点击某个对象ondblclick:鼠标双击某个对象onerror:当加载文档或图像时发生某个错误onfocus:元素获得焦点onkeydown:某个键盘的键被按下onkeypress:某个键盘的键被按下或按住onkeyup:某个键盘的键被松开onload:某个页面或图像被完成加载onmousedown:某个鼠标按键被按下onmousemove:鼠标被移动onmouseout:鼠标从某元素移开onmouseover:鼠标被移到某个元素之上onmouseup:某个鼠标按键被松开onreset:重置按钮被点击onresize:窗口或框架被调整尺寸onselect:文本被选定onsubmit:提交按钮被点击onunload:用户退出页面2、Brower对象（BOM）WindowWindow对象表示浏览器中打开的窗口如果文档中包含框架（frame或iframe标签），浏览器会为HTML文档创建一个window对象，并为每个框架创建一个额外的window对象Window对象集合Frames[]:返回窗口中所有命名的框架。
