什么是跨域?跨域解决方法有哪些?
跨域是指当请求非同源的URL链接,简单说就是协议,域名,端口中存在有和当前Url不同的就是跨域 跨域解决方法 1)cors:后端服务器设置 2)nginx反向代理 3)jsonp 由于script的src不受同源策略限制,我们可以通过src访问服务器上的脚本进行数据回调 (动态创建script标签,回调函数)
跨域是指当请求非同源的URL链接,简单说就是协议,域名,端口中存在有和当前Url不同的就是跨域 跨域解决方法 1)cors:后端服务器设置 2)nginx反向代理 3)jsonp 由于script的src不受同源策略限制,我们可以通过src访问服务器上的脚本进行数据回调 (动态创建script标签,回调函数)
map 和 forEach 的区别是map返回一个新的数组,forEach返回undefined。 使用场景:修改或返回新数组使用map,相反只是做遍历循环时用foreach 或 for const array = [1, 2, 3, 4, 5] const arr = array.forEach(x => x * x) const arr2 = array.map(x => x * x) console.log(array) // [1, 2, 3, 4, 5] console.log(arr) // undefined console.log(arr2) //[1, 4, 9, 16, 25]
% – %单位用于设置相对于当前字体大小的字体大小。 em -相对于当前对象内文本的字体尺寸(参考物是父元素的font-size) 注意:这里的 2em 表示当前字体大小的 2 倍。 rem – rem是相对于HTML根元素的字体大小(font-size)来计算的长度单位 px -相对于显示器屏幕分辨率 vh - 相对于视口高度的 1%。 vw – 相对于视口宽度的 1%
localStorage: localStorage.setItem(key, value) localStorage.getItem(key) localStorage.removeItem(key) localStorage.clear() sessionStorage: sessionStorage.setItem(key, value) sessionStorage.getItem(key) sessionStorage.removeItem(key) sessionStorage.clear() 特性 LocalStorage SessionStorage Cookie 存放数据大小 LocalStorage 的存储容量为5MB/10MB SessionStorage 的存储容量为5MB Cookies的存储容量为4KB 数据生命周期 由于它不是基于会话的,因此必须通过 javascript 或手动删除 它是基于会话的,可以按窗口或选项卡工作。这意味着数据仅在会话期间存储,即直到浏览器(或选项卡)关闭 Cookies 根据选项卡和窗口的设置和工作过期 存储方式 客户端只能读取本地存储 客户端只能读取本地存储 客户端和服务器都可以读取和写入 cookie 向服务器传输数据 没有向服务器传输数据 没有向服务器传输数据 存在到服务器的数据传输 浏览器兼容性 支持它的旧浏览器较少 支持它的旧浏览器较少 所有浏览器都支持它,包括旧版浏览器 共同点 都是保存在浏览器端 都是保存在浏览器端 都是保存在浏览器端
关于接口获取数据get请求和post请求区别和使用方式。 特性 get post 参数位置 参数拼接到URL后面 参数在请求体中 参数大小 受限于浏览器url大小,一般不超过32K 1G 安全性 参数暴露在URL中,安全性低 相对get安全性更高些 适用场景 从服务器端获取数据 从服务器端获取数据 缓存 在浏览器中可缓存 不可以缓存
内存泄露 内存泄露是指一块被分配的内存既不能使用,又不能回收,直到浏览器进程结束。 可能出现内存泄漏的原因 1、 意外的全局变量 2、 DOM元素清空时,还存在引用 3、 闭包 4、 遗忘的定时器 内存泄漏优化方法 1、 全局变量先声明在使用 2、 避免过多使用闭包。 3、 注意清除定时器和事件监听器。
1、 concat关键字 arr.concat(arr2, arr3, ······) 2、 es6 展开运算符(…) […arr1, …arr2,······] 3、 push() push(…arr) 通过push合并数组有以下2中形式 1)使用es6扩展运算符合并 2)结合for循环,遍历一个数组,然后push到另一个数组中。
v-model原理: 原生 input 元素若是text/textarea类型,使用 value 属性和 input 事件。 原生 input 元素若是radio/checkbox类型,使用 checked属性和 change 事件。 原生 select 元素,使用 value 属性和 change 事件。 input 元素上使用 v-model 等价于 <input :value="message" @input="message = $event.target.value" />
内置组件router-link不生效的原因:router-link会阻止click事件,为决绝这一问题我们在事件绑定上加个native事件修饰符如: 使用@click.native。 .native指直接监听一个原生事件。
表单修饰符 lazy: 失去焦点后同步信息 trim: 自动过滤首尾空格 number: 输入值转为数值类型 事件修饰符 stop:阻止冒泡 prevent:阻止默认行为 self:仅绑定元素自身触发 once:只触发一次 鼠标按钮修饰符 left:鼠标左键 right:鼠标右键 middle:鼠标中间键