食品销售公司网站制作,电子产品在哪些网站做调研,免费网站大全,网页设计表格#x1f308;个人主页#xff1a;前端青山 #x1f525;系列专栏#xff1a;Javascript篇 #x1f516;人终将被年少不可得之物困其一生 依旧青山,本期给大家带来JavaScript篇专栏内容:JavaScript全面指南(二) 目录
21、说明如何使用JavaScript提交表单#xff1f;
2…
个人主页前端青山 系列专栏Javascript篇 人终将被年少不可得之物困其一生 依旧青山,本期给大家带来JavaScript篇专栏内容:JavaScript全面指南(二) 目录
21、说明如何使用JavaScript提交表单
22、aync await的好处
23、移动端点击事件300ms延迟如何去掉原因是什么
24、Cookie有哪些属性其中HttpOnlySecureExpire分别有什么作用
25、 JavaScript中的循环结构都有什么*
26、说明“”和“”之间的区别
27、3 2 “7”的结果是什么
28、说明如何检测客户端机器上的操作系统
29、将1234567转换为1,234,567
30、Javascript中的NULL是什么意思
31、delete操作符的功能是什么
32、JavaScript中有哪些类型的弹出框
33、document load和documen ready 的区别
34、如何自定义事件
35、用setTImeout 来实现setInterval
36、什么是JavaScript Cookie
37、在JavaScript中使用innerHTML的缺点是什么
38、如何创建通用对象
39、在JavaScript中使用的Push方法是什么
40、如何避免回调地狱 21、说明如何使用JavaScript提交表单
要使用JavaScript提交表单请使用
document.form [0] .submit;
22、aync await的好处
async和await可以说是异步终极解决方案了相比直接使用Promise来说优势在于处理then的调用链能够更清晰准确的写出代码毕竟写一大堆then也很恶心并且也能优雅地解决回调地狱问题。当然也存在一些缺点因为await将异步代码改造成了同步代码如果多个异步代码没有依赖性却使用了await会导致性能上的降低
23、移动端点击事件300ms延迟如何去掉原因是什么
300毫秒原因
当用户第一次点击屏幕后需要判断用户是否要进行双击操作于是手机会等待300毫秒
解决方案 faskclick.js
原理
在检测到touchend事件的时候会通过DOM自定义事件立即出发模拟一个click事件并把浏览器在300ms之后真正的click事件阻止掉
25.function Foo(){getNamefunction(){Console.log(1)}return this;
}
Foo.geteNamefunction(){console.log(2)}
Foo.prototype.geteNamefunction(){console.log(3)}
var geteNamefunction(){console.log(4)}
function getName(){console.log(5)}
//输出结果
Foo.geteName()//2
geteName()//4
Foo().geteName()//1
geteName()//1
new Foo.geteName()//2
new Foo().geteName()//3
new new Foo().geteName()//3
24、Cookie有哪些属性其中HttpOnlySecureExpire分别有什么作用
Cookie总是保存在客户端中按在客户端中的存储位置可分为内存Cookie和硬盘Cookie。内存Cookie由浏览器维护保存在内存中浏览器关闭后就消失了其存在时间是短暂的。硬盘Cookie保存在硬盘里有一个过期时间除非用户手工清理或到了过期时间硬盘Cookie不会被删除其存在时间是长期的。所以按存在时间可分为非持久Cookie和持久Cookie。
HTTP请求cookie的交互流程 如果步骤5携带的是过期的cookie或者是错误的cookie那么将认证失败返回至要求身份认证页面。
HTTP协议作为无状态协议对于HTTP协议而言无状态同样指每次request请求之前是相互独立的当前请求并不会记录它的上一次请求信息。那么问题来了既然无状态那完成一套完整的业务逻辑发送多次请求的情况数不胜数使用http如何将上下文请求进行关联呢机智的人类通过优化找到了一种简单的方式记录http协议的请求信息。
优化后的HTTP请求 浏览器发送request请求到服务器服务器除了返回请求的response之外还给请求分配一个唯一标识ID协同response一并返回给浏览器。 同时服务器在本地创建一个MAP结构专门以key-value请求ID-会话内容形式将每个request进行存储 此时浏览器的request已经被赋予了一个ID第二次访问时服务器先从request中查找该ID根据ID查找维护会话的content内容该内容中记录了上一次request的信息状态。 根据查找出的request信息生成基于这些信息的response内容再次返回给浏览器。如果有需要会再次更新会话内容为下一次请求提供准备。
所以根据这个会话ID以建立多次请求-响应模式的关联数据传递。说到这里可能已经唤起了大家许多共鸣。这就是cookie和session对无状态的http协议的强大作用。服务端生成这个全局的唯一标识传递给客户端用于唯一标记这次请求也就是cookie而服务器创建的那个map结构就是session。所以cookies由服务端生成用于标记客户端的唯一标识无特定含义在每次网络请求中都会被传送。session服务端自己维护的一个map数据结构记录key-content上下文内容状态。
cookie的属性
一般cookie具有7个属性包括
Name就是cookieName一般用字母或数字不能包含特殊字符没什么好说的。
valuecookieName对应的值。
Domain域表示当前cookie所属于哪个域或子域下面例如.baidu.com就表示在.baidu.com下可以访问。
对于服务器返回的Set-Cookie中如果没有指定Domain的值那么其Domain的值是默认为当前所提交的http的请求所对应的主域名的。比如访问 http://www.example.com返回一个cookie没有指名domain值那么其为值为默认的www.example.com。
Path表示cookie的所属路径一般设为“/”表示同一个站点的所有页面都可以访问这个cookie。
Expires/Max-age表示了cookie的有效期。expires的值是一个GMT格式的时间过了这个时间该cookie就失效了。或者是用max-age指定当前cookie是在多长时间之后而失效。如果服务器返回的一个cookie没有指定其expire time那么表明此cookie有效期只是当前的session即是session cookie当前session会话结束后就过期了。对应的当关闭浏览器中该页面的时候此cookie就应该被浏览器所删除了。
secure表示该cookie只能用https传输。一般用于包含认证信息的cookie要求传输此cookie的时候必须用https传输。
httponly表示此cookie必须用于http或https传输。这意味着浏览器脚本比如javascript中是不允许访问操作此cookie的。
如果你用的是谷歌浏览器此时可以右击鼠标选择检查选择Application标签页左侧找到cookies点击就可以看到这几个属性了
25、 JavaScript中的循环结构都有什么*
For、While、do-while loops
26、说明“”和“”之间的区别
“”仅检查值相等而“”是一个更严格的等式判定如果两个变量的值或类型不同则返回false。
27、3 2 “7”的结果是什么
由于3和2是整数它们将直接相加。由于7是一个字符串它将会被直接连接所以结果将是57。
28、说明如何检测客户端机器上的操作系统
为了检测客户端机器上的操作系统应使用navigator.appVersion字符串属性
29、将1234567转换为1,234,567
//法一
function parseNum(num){ var list new String(num).split().reverse(); for(var i 0; i list.length; i){ if(i % 4 3){ list.splice(i, 0, ,); } } return list.reverse().join();
} console.log(parseNum(10000121213)); //法二
function parseNum(num){ var reg/(?(?!\b)(\d{3})$)/g; return String(num).replace(reg, ,);
}
console.log(parseNum(10000121213)); //法三
String.prototype.strReverse function(){ return this.split().reverse().join();
} function parseNum(num){ var str_num String(num); var len str_num.length; var tail str_num.slice(0, len % 3); tail tail.strReverse(); var reg/\d{3}/g; var list str_num.strReverse().match(reg); list.push(tail); var res list.join(,).strReverse(); return res;
}
console.log(parseNum(10000121213)); //法四
function parseNum(num){ var list String(num).split().reverse(); var temp []; for(var i 0, len list.length; i len; i i 3){ temp.push(list.slice(i, i 3).join()); } return temp.join(,).split().reverse().join();
}
console.log(parseNum(10000121213));
30、Javascript中的NULL是什么意思
NULL用于表示无值或无对象。它意味着没有对象或空字符串没有有效的布尔值没有数值和数组对象。
31、delete操作符的功能是什么
delete操作符用于删除程序中的所有变量或对象但不能删除使用VAR关键字声明的变量。
32、JavaScript中有哪些类型的弹出框
Alert、Confirm and、Prompt
33、document load和documen ready 的区别
页面加载完成有两种事件
1.load是当页面所有资源全部加载完成后包括DOM文档树css文件js文件图片资源等执行一个函数
问题如果图片资源较多加载时间较长onload后等待执行的函数需要等待较长时间所以一些效果可能受到影响
2.$(document).ready()是当DOM文档树加载完成后执行一个函数 不包含图片css等所以会比load较快执行
在原生的jS中不包括ready()这个方法只有load方法就是onload事件
34、如何自定义事件 事件的创建
JS中最简单的创建事件方法是使用Event构造器
var myEvent new Event(event_name);
但是为了能够传递数据就需要使用 CustomEvent 构造器
var myEvent new CustomEvent(event_name, {detail:{// 将需要传递的数据写在detail中以便在EventListener中获取// 数据将会在event.detail中得到},
}); 事件的监听
JS的EventListener是根据事件的名称来进行监听的比如我们在上文中已经创建了一个名称为‘event_name’ 的事件那么当某个元素需要监听它的时候就需要创建相应的监听器 //假设listener注册在window对象上
window.addEventListener(event_name, function(event){// 如果是CustomEvent传入的数据在event.detail中console.log(得到数据为, event.detail);
// ...后续相关操作
}); 至此window对象上就有了对‘event_name’ 这个事件的监听器当window上触发这个事件的时候相关的callback就会执行。 事件的触发
对于一些内置built-in的事件通常都是有一些操作去做触发比如鼠标单击对应MouseEvent的click事件利用鼠标ctrl滚轮上下去放大缩小页面对应WheelEvent的resize事件。 然而自定义的事件由于不是JS内置的事件所以我们需要在JS代码中去显式地触发它。方法是使用 dispatchEvent 去触发IE8低版本兼容使用fireEvent
// 首先需要提前定义好事件并且注册相关的EventListener
var myEvent new CustomEvent(event_name, { detail: { title: This is title!},
});
window.addEventListener(event_name, function(event){console.log(得到标题为, event.detail.title);
});
// 随后在对应的元素上触发该事件
if(window.dispatchEvent) { window.dispatchEvent(myEvent);
} else {window.fireEvent(myEvent);
}
// 根据listener中的callback函数定义应当会在console中输出 得到标题为 This is title!
需要特别注意的是当一个事件触发的时候如果相应的element及其上级元素没有对应的EventListener就不会有任何回调操作。 对于子元素的监听可以对父元素添加事件托管让事件在事件冒泡阶段被监听器捕获并执行。这时候使用event.target就可以获取到具体触发事件的元素。
35、用setTImeout 来实现setInterval
function interval(func, w, t){var interv function(){if(typeof t undefined || t-- 0){setTimeout(interv, w);try{func.call(null);}catch(e){t 0;throw e.toString();}}};
setTimeout(interv, w);
};
这个interval函数有一个叫做inter的内部函数它通过setTimeout来自动被调用在inter中有一个闭包它检查了重复次数调用了回调函数并通过setTimeout再次调用了interv。万一回调函数中出现了一个异常interv调用将会终止异常也会被抛出。
这种木事当然不能保证函数在固定的间隔中执行但是它保证新的区间开始时上一个区间中的函数已经执行完毕我认为这是非常重要的。
用法
现在我们可以在10秒的区间内执行一段代码5次代码如下interval(function(){//执行的代码在这
},1000,10);36、什么是JavaScript Cookie
Cookie是用来存储计算机中的小型测试文件当用户访问网站以存储他们需要的信息时它将被创建。
37、在JavaScript中使用innerHTML的缺点是什么
如果在JavaScript中使用innerHTML缺点是内容随处可见不能像“追加到innerHTML”一样使用即使你使用 like“innerHTML innerHTML html”旧的内容仍然会被html替换整个innerHTML内容被重新解析并构建成元素因此它的速度要慢得多innerHTML不提供验证因此我们可能会在文档中插入有效的和破坏性的HTML并将其中断。
38、如何创建通用对象
通用对象可以创建为
var I new object();
39、在JavaScript中使用的Push方法是什么
push方法用于将一个或多个元素添加或附加到数组的末尾。使用这种方法可以通过传递多个参数来附加多个元素。
40、如何避免回调地狱
promise async await
