javascript
程序牛0314
学无止境,书山有路勤为径,学海无涯苦作舟
展开
-
vue里methods watch和computed的区别和联系
vue常见面试题1.vue优点?答:轻量级框架:只关注视图层,是一个构建数据的视图集合,大小只有几十kb;简单易学:国人开发,中文文档,不存在语言障碍 ,易于理解和学习;双向数据绑定:保留了angular的特点,在数据操作方面更为简单;组件化:保留了react的优点,实现了html的封装和重用,在构建单页面应用方面有着独特的优势;视图,数据,结构分离:使数据的更改更为简单,不需要进行逻辑代码的修改,只需要操作数据就能完成相关操作;虚拟DOM:dom操作是非常耗费性能的, 不再使用原生的do原创 2021-03-09 11:30:44 · 266 阅读 · 0 评论 -
前后端之间的跨域问题 解决方法
跨域问题: 编辑器打开 地址: http://127.0.0.1:5500/day10/front-end/index.html 请求数据接口地址:http://127.0.0.1:3000/userall 报错:has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource什么情况是跨域:同源:协议、 主机原创 2021-01-20 21:16:46 · 295 阅读 · 0 评论 -
前后端开发需求分析
前端开发1、根据需求文档+产品原型+UI设计图 实现静态页面需求:实现 添加用户 、展示所有用户信息、删除用户、通过姓名搜索用户原型:表单 添加 + 搜索框 + 表格展示UI:2、表格展示的数据 ,通过请求后台数据接口 ,得到数据 ,进行渲染3、点击 表单中的添加 ,将表单数据 通过 请求后台数据接口,发送给后台4、点击 删除按钮 ,请求后台数据接口,进行删除5、点击搜索,请求后台数据接口,得到 搜索结果,进行渲染node后端开发1、实现 http 服务器技术栈:node +原创 2021-01-20 21:03:06 · 1971 阅读 · 0 评论 -
nodejs里npm包管理器的基本操作命令
1、 使用npm 管理npm init -y 生产项目配置文件 package.json2、通过npm 下载 安装 项目生产依赖 jquery 模块npm install jquery --save3、通过npm 下载 安装 项目开发依赖 zepto 模块npm install jquery --save4、通过npm 卸载 jquery 模块npm uninstall jquery5、通过npm 卸载 zepto 模块npm uninstall zepto发现问题:下载速度 太慢原创 2021-01-19 18:33:26 · 72 阅读 · 0 评论 -
js arguments伪数组/类数组转数组
js arguments伪数组/类数组转数组 <script> // 实参个数不确定,接收所有实参 function fn(){ console.log( arguments ); // 伪数据/类数组 console.log( arguments.callee);// 当前函数 console.log( Array.from(arguments) ); co原创 2021-01-18 18:19:50 · 75 阅读 · 0 评论 -
js前端实现分页
js前端实现分页<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <原创 2021-01-18 18:17:32 · 542 阅读 · 0 评论 -
jquery概述
一、什么是 jQuery ?jQuery是一个JavaScript函数库。jQuery是一个轻量级的"写的少,做的多"的JavaScript库。jQuery库包含以下功能:HTML 元素选取HTML 元素操作CSS 操作HTML 事件函数JavaScript 特效和动画HTML DOM 遍历和修改AJAX二、1.x、2.x、3.x 三大系列的区别下载jquery : https://www.bootcdn.cn/jquery/jquery.js 有注释,有代码风格 — 开发版-原创 2021-01-18 18:14:37 · 89 阅读 · 0 评论 -
jquery实现隔行变色
jquery实现表单动态输入隔行变色<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="./jq原创 2021-01-18 18:13:30 · 139 阅读 · 0 评论 -
ready和onload的区别
$(document).ready和window.onload的区别:$(document).ready和window.onload都是在都是在页面加载完执行的函数,大多数情况下差别不大。$(document).ready:是DOM结构绘制完毕后就执行,不必等到加载完毕。 意思就是DOM树加载完毕,就执行,不必等到页面中图片或其他外部文件都加载完毕。并且可以写多个.ready。window.onload:是页面所有元素都加载完毕,包括图片等所有元素。只能执行一次。所以,$(document).rea原创 2021-01-14 20:04:03 · 248 阅读 · 0 评论 -
JS 对象的深拷贝和浅拷贝
顶部css代码深拷贝已经是一个老生常谈的话题了,也是现在前端面试的高频题目。 我们来明确一下深拷贝和浅拷贝的定义:浅拷贝:创建一个新对象,这个对象有着原始对象属性值的一份精确拷贝。如果属性是基本类型,拷贝的就是基本类型的值,如果属性是引用类型,拷贝的就是内存地址 ,所以如果其中一个对象改变了这个地址,就会影响到另一个对象。深拷贝:将一个对象从内存中完整的拷贝一份出来,从堆内存中开辟一个新的区域存放新对象,且修改新对象不会影响原对象。话不多说,浅拷贝就不再多说,下面我们直入正题:深拷贝已经是一原创 2021-01-12 20:22:25 · 68 阅读 · 0 评论 -
深拷贝和浅拷贝的定义与代码实现
深拷贝和浅拷贝的定义递归实现深拷贝顶部深拷贝已经是一个老生常谈的话题了,也是现在前端面试的高频题目。我们来明确一下深拷贝和浅拷贝的定义:浅拷贝:创建一个新对象,这个对象有着原始对象属性值的一份精确拷贝。如果属性是基本类型,拷贝的就是基本类型的值,如果属性是引用类型,拷贝的就是内存地址 ,所以如果其中一个对象改变了这个地址,就会影响到另一个对象。深拷贝:将一个对象从内存中完整的拷贝一份出来,从堆内存中开辟一个新的区域存放新对象,且修改新对象不会影响原对象。话不多说,浅拷贝就不再多说,下面我们原创 2021-01-12 19:27:30 · 395 阅读 · 0 评论 -
浅拷贝与深拷贝的含义区别及实现
面试的时候,经常会问深拷贝与浅拷贝的问题。因为它可以考察一个人的很多方面,比如基本功,逻辑能力,编码能力等等。另外在实际工作中,也常会遇到它。比如用于页面展示的数据状态,与需要传给后端的数据包中,有部分字段的值不一致的话,就需要在传参时根据接口文档覆写那几个字段的值。最常见的可能就是 status 这个参数了。界面上的展示需要 Boolean 值,而后端同学希望拿到的是 Number 值,1 或者 0。为了不影响展示效果,往往就需要深拷贝一下,再进行覆写,否则界面上就会因为某些值的变化,出现奇怪的现象。原创 2021-01-12 18:57:06 · 325 阅读 · 0 评论 -
js前端基础面试题理论题目
1.工厂模式、原型模式、构造函数模式、组合模式。优缺点2.简述什么是原型3.简述什么是原型链4.简述this指向,如何改变this指向5.new操作符具体干了什么工厂函数// 优点: 返回 新对象,互不影响// 缺点: 代码重复(相同方法)、// 没有从属(不能知道对象从那里来)-->instanceof 只能判断 是 对象,不能判断属于谁原型模式// 优点: 公共/相同 的 属性 、方法 不重复// 有从属关系// 缺点: 原型上的 ...原创 2021-01-09 20:00:48 · 72 阅读 · 0 评论 -
对JS闭包的理解
闭包的简介:闭包就是能够读取其他函数内部变量的函数。只有函数内部的子函数才能读取局部变量,在本质上,闭包是函数内部和函数外部连接起来的桥梁。当函数可以记住并访问所在词法作用域时,就产生了闭包,即使函数是在当前词法作用域之外执行。 - - 出自《你不知道的JavaScript(上卷)》闭包的定义:如果在一个内部函数里,对在外部作用域(但不是全局作用域)的变量进行引用,那么内部函数就被认为是闭包(closure)。闭包的特点:可以读取自身函数外部的变量(沿着作用域链寻找)先从自身开始查找,如果自身没原创 2021-01-08 22:12:44 · 102 阅读 · 0 评论 -
http和https的区别-详解
目录HTTP与HTTPS介绍HTTPS和HTTP的主要区别客户端在使用HTTPS方式与Web服务器通信时的步骤CA证书的申请及其使用过程HTTPS的缺点SSL与TLS的区别?SSL/TLS历史SSL/TLS协议的基本过程HTTPS涉及的计算环节如何优化HTTPS的速度HTTP与HTTPS介绍超文本传输协议HTTP协议被用于在Web浏览器和网站服务器之间传递信息,HTTP协议以明文方式发送内容,不提供任何方式的数据加密,如果攻击者截取了Web浏览器和网站服务器之间的传输报文,就可以直接原创 2020-12-29 20:27:46 · 147 阅读 · 0 评论 -
Jsonp及其实现原理
Jsonp及其实现原理一、先说说JSON首先JSON是一种基于文本的数据交换方式,或者叫做数据描述格式。JSON的优点:基于纯文本,跨平台传递极其简单;Javascript原生支持,后台语言几乎全部支持;轻量级数据格式,占用字符数量极少,特别适合互联网传递;可读性较强,虽然比不上XML那么一目了然,但在合理的依次缩进之后还是很容易识别的;容易编写和解析,当然前提是你要知道数据结构;二、同源策略一个众所周知的问题,由于同源策略,Ajax直接请求普通文件存在跨域无权限访问的问题。同源策略,转载 2020-12-27 16:01:11 · 305 阅读 · 0 评论 -
深入浅出JSONP--解决ajax跨域问题
取不到数据! 上周客户新买了服务器,原本在旧的服务器上放着客户的Web主页信息和一个后台程序(asp.net),在客户的主页中有一个动态显示最新消息的处理,这个处理就是通过ajax异步从那个后台程序中取得的。由于又购买了新的服务器,客户想把web主页和那个后台程序分开来,后台程序被部署到了新的服务器上。不过这个项目是我的同事小福同志开发的,也就由他来把程序分开部署,然后进行一些小改动。"怎么最新消息取不到了,异步处理的url也已经添加上新服务器的地址(http://xxxx.com/…/news.as转载 2020-12-27 15:35:24 · 57 阅读 · 0 评论 -
浅谈 JSONP 的原理与实现
一、什么是JSONP1.1 同源策略如果两个页面拥有相同的协议,端口(如果指定),和主机,那么这两个页面就属于同一个源。同源策略分为:DOM同源策略:禁止对不同源页面DOM进行操作XMLHttpRequest同源策略:禁止向不同源的地址发起HTTP请求由此可见,Ajax禁止跨域。1.2 JSONP的原理JSONP是JSON with Padding的简称,一般用来解决Ajax跨域的问题。它是这样产生的:页面上调用js文件时不受跨域的影响,而且,凡是拥有src属性的标签都拥有跨域的能力,比如原创 2020-12-27 15:30:07 · 156 阅读 · 0 评论 -
jQuery实现轮播图效果图
如何用 jQuery 实现轮播图直接点击 对应的链接看对应具体代码注释很详细了,就不做赘述了一定一定不要忘记加入 jQuery顶部html代码css代码js代码方便你们复制,直接来一个全部的全部在一起的代码html代码回到顶部查看其他代码 <!-- 设置点击原点,切换相应的图片 --> <ul class="ul_2">原创 2020-12-26 18:45:16 · 1259 阅读 · 4 评论 -
js的六种继承方式及其优缺点
一、原型链继承 /* 原型链: JavaScript中实现继承最简单的方式就是使用原型链,将子类型的原型指向父类型的实例即可,即“子类型.prototype = new 父类型();”,实现方法如下: */ //为父类型创建构造函数 function SuperType () { this.name = ['zc','ls','ww']; this.property = true; } //为父类型添加方法 SuperType.proto原创 2020-12-26 18:28:08 · 191 阅读 · 0 评论 -
简单高效的理解js原型链--js面向对象编程
(一看就懂,但18岁以下请绕道)原型链理解起来有点绕了,网上资料也是很多,每次晚上睡不着的时候总喜欢在网上找点原型链和闭包的文章看,效果极好。不要纠结于那一堆术语了,那除了让你脑筋拧成麻花,真的不能帮你什么。简单粗暴点看原型链吧,想点与代码无关的事,比如人、妖以及人妖。1)人是人他妈生的,妖是妖他妈生的。人和妖都是对象实例,而人他妈和妖他妈就是原型。原型也是对象,叫原型对象。2)人他妈和人他爸啪啪啪能生出一堆人宝宝、妖他妈和妖他爸啪啪啪能生出一堆妖宝宝,啪啪啪就是构造函数,俗称造人。3)人他原创 2020-12-26 18:09:24 · 125 阅读 · 0 评论 -
Javascript面向对象三大特性详解及创建对象的各种方法
Javascript面向对象三大特性(封装性、继承性、多态性)详解及创建对象的各种方法Javascript基于对象的三大特征和C++,Java面向对象的三大特征一样,都是封装(encapsulation)、继承(inheritance )和多态(polymorphism )。只不过实现的方式不同,其基本概念是差不多的。其实除三大特征之外,还有一个常见的特征叫做抽象(abstract),这也就是我们在一些书上有时候会看到面向对象四大特征的原因了。一、封装性封装就是把抽象出来的数据和对数据的操作封装在一起原创 2020-12-26 17:31:02 · 201 阅读 · 0 评论 -
js面向对象及面向对象的三大特性
一:js面向对象编程在es5中我们是这样去写面向对象的编程方式的:function Person(name) { //构造函数里面的方法和属性 this._name = name; this.getName = function () { console.log(this._name); }; this.setName = function (name) { this._name = name; }; }原创 2020-12-26 17:21:15 · 117 阅读 · 0 评论 -
js(javascript)实现继承的6种方式以及优缺点详解
js继承的6种方式想要继承,就必须要提供个父类(继承谁,提供继承的属性) 一、原型链继承 重点:让新实例的原型等于父类的实例。 特点:1、实例可继承的属性有:实例的构造函数的属性,父类构造函数属性,父类原型的属性。(新实例不会继承父类实例的属性!) 缺点:1、新实例无法向父类构造函数传参。 2、继承单一。 3、所有新实例都会共享父类实例的属性。(原型上的属性是共享的,一个实例修改了原型属性,另一个实例的原型属性也会被修改!) 二、原创 2020-12-26 17:14:48 · 1790 阅读 · 0 评论 -
HTTP常见状态码
HTTP状态码表示客户端HTTP请求的返回结果、标记服务器端的处理是否正常或者是出现的错误,能够根据返回的状态码判断请求是否得到正确的处理很重要。HTTP状态码由三个十进制数字组成,第一个十进制数字定义了状态码的类型,后两个数字没有分类的作用。HTTP状态码共分为5种类型:分类分类描述1**信息,服务器收到请求,需要请求者继续执行操作2**成功,操作被成功接收并处理3**重定向,需要进一步的操作以完成请求4**客户端错误,请求包含语法错误或无法完成请求5**服务器错误,服务器在处理请求的过程原创 2020-12-23 18:39:32 · 120 阅读 · 0 评论 -
jquery/jq实现折叠菜单
css代码<style type="text/css"> li{ list-style: none; } .menu>li>ul{ display: none; } h1{ cursor: pointer; }</style>//引入jquery<script src="js/jquery-3.5.1.js" type="text/javascript"></script>h原创 2020-12-23 12:07:50 · 258 阅读 · 0 评论