目录
-
跨域问题
-
symbol
-
什么是事件监听
-
手写Promise
-
原型链
-
转化下划线命名到驼峰命名
-
js字符串转数字的方法
-
给两个构造函数A和B,如何实现A继承B?
-
如果已经有三个promise,A、B和C,想串行执行,该怎么写?
-
js小题
-
js加载过程阻塞,解决方法
-
Event loop事件循环机制
-
js大数转换
-
手写repeat方法
-
手写bind call apply方法
1.跨域问题
2. symbol
JavaScript基本数据类型有6种:Undefined、Null、Boolean、String、Number、Object。
ES6新增了一种数据类型:Symbol,表示独一无二的值,Symbol最大的用途是用来定义对象的唯一属性名。
ES5的对象属性名都是字符串,容易造成属性名的冲突。如使用了一个其他人提供的对象,但又想为其添加新的方法(mixin模式),那么新方法的名字有可能与已有方法产生冲突。因此,需要保证每个属性的名字都是独一无二,以防止属性名的冲突。这就是ES6引入Symbol的原因。
3. 什么是事件监听
addEventListener()方法,用于向指定元素添加事件句柄,它可以更简单的控制事件,语法为
element.addEventListener(event, function, useCapture);
第一个参数是事件的类型(如 "click" 或 "mousedown").
第二个参数是事件触发后调用的函数。
第三个参数是个布尔值用于描述事件是冒泡还是捕获。该参数是可选的。
事件传递有两种方式,冒泡和捕获
事件传递定义了元素事件触发的顺序,如果你将P元素插入到div元素中,用户点击P元素,
在冒泡中,内部元素先被触发,然后再触发外部元素,
捕获中,外部元素先被触发,在触发内部元素,
3.手写Promise
setTimeout实现异步
通过订阅发布防止异步不执行resolve reject
4.原型链
https://www.cnblogs.com/loveyaxin/p/11151586.html
5. 转化下划线命名到驼峰命名
public static String UnderlineToHump(String para){
StringBuilder result=new StringBuilder();
String a[]=para.split("_");
for(String s:a){
if(result.length()==0){
result.append(s.toLowerCase());
}else{
result.append(s.substring(0, 1).toUpperCase());
result.append(s.substring(1).toLowerCase());
}
}
return result.toString();
}
}
6. js字符串转数字的方法
https://www.cnblogs.com/langtianya/p/4758491.html
7.给两个构造函数A和B,如何实现A继承B?
function A(...) {} A.prototype...
function B(...) {} B.prototype...
A.prototype = Object.create(B.prototype);
8.如果已经有三个promise,A、B和C,想串行执行,该怎么写?
// promise
A.then(B).then(C).catch(...)
// async/await
(async ()=>{
await a();
await b();
await c();
})()
9.js小题
Function.prototype.a = 1;
Object.prototype.b = 2;
function A() {}
var a = new A();
console.log(a.a, a.b); // undefined, 2
console.log(A.a, A.b); // 1, 2
https://www.cnblogs.com/everlose/p/12930468.html
10.js加载过程阻塞,解决方法
指定script标签的async属性。
如果async="async",脚本相对于页面的其余部分异步地执行(当页面继续进行解析时,脚本将被执行)
如果不使用async 且 defer="defer":脚本将在页面完成解析时执行
11. Event loop事件循环机制
https://blog.csdn.net/java_xiaoo/article/details/113666279
12. 微任务与宏任务
async function async1() {
console.log('async1 start');//2
await async2();//
console.log('async1 end');//6
}
async function async2() {
console.log('async2');//3
}
console.log('illegalscript start');//1
setTimeout(function() {
console.log('setTimeout');//8
}, 0);
async1();
new Promise(function(resolve) {
console.log('promise1');//4
resolve();
}).then(function() {
console.log('promise2');//7
});
console.log('illegalscript end');//5
https://blog.csdn.net/qq_41681425/article/details/85775077
13. js大数转换
var a = '123456789';
var b = '9999999999999999912346789123456789';
function add(a,b) {
if (a.length < b.length){
let arr = Array(b.length - a.length).fill(0);
a = arr.join('') + a;
} else {
let arr = Array(a.length - b.length).fill(0);
b = arr.join('') + b
}
a = a.split('').reverse();
b = b.split('').reverse();
let sign = 0;
var newResult = [];
for(let i = 0;i < a.length;i++ ){
let c = a[i]/1 + b[i]/1 + sign;
if (c >= 10){
sign = 1;
newResult.unshift(c%10)
} else {
sign = 0;
newResult.unshift(c)
}
}
let result = newResult.join('');
console.log(result);
}
add(a,b)
https://blog.csdn.net/weixin_41421227/article/details/109521998
14. 手写repeat方法
function sleep (func,wait,args) {
return new Promise((resolve)=>{
setTimeout(()=>{
func.apply(this,args);
resolve()
},wait)
})
}
function repeat(func, times, wait,args) {
return async function () {
for(i = 0;i<times;i++){
await sleep(func,wait,args)
}
}
}
function alert(){
console.log('hellowWord');
}
const repeatFunc = repeat(alert, 4, 3000);
repeatFunc()
// 调用这个 repeatFunc ("hellworld"),会alert4次 helloworld, 每次间隔3秒
15. 手写bind call apply方法
https://my.oschina.net/u/4359458/blog/3224991
https://blog.csdn.net/weixin_34218579/article/details/88068954?utm_term=%E6%89%8B%E5%86%99apply&utm_medium=distribute.pc_aggpage_search_result.none-task-blog-2allsobaiduweb~default-6-88068954&spm=3001.4430
16. 把类数组对象变为数组
17. 变量生命
18. promise resolve可以传一个对象吗
19. 展开数组
20. es6和es5 变量声明区别
21. Object.assign
22. ES5与ES6继承
23. 手写compose
24. Object.keys
25. 手写reduce
26. javascript优缺点
1. 什么是JavaScript
JavaScript是一种基于对象(Object)和事件驱动(Event Driven)并具有相对安全性的客户端脚本语言。同时也是一种广泛用于客户端Web开发的脚本语言,常用来给HTML网页添加动态功能,比如响应用户的各种操作。它最初由网景公司(Netscape)的Brendan Eich设计,是一种动态、弱类型、基于原型的语言,内置支持类。
2. JavaScript的特点
(1).一种解释性执行的脚本语言。
同其他脚本语言一样,JavaScript也是一种解释性语言,其提供了一个非常方便的开发过程。JavaScript的语法基本结构形式与C、C++、Java十分类似。但在使用前,不像这些语言需要先编译,而是在程序运行过程中被逐行地解释。JavaScript与HTML标识结合在一起,从而方便用户的使用操作。
(2).一种基于对象的脚本语言。有哪些内置对象
其也可以被看作是一种面向对象的语言,这意味着JavaScript能运用其已经创建的对象。因此,许多功能可以来自于脚本环境中对象的方法与脚本的相互作用。
(3).一种简单弱类型脚本语言。怎么解决浮点数精度问题
其简单性主要体现在:首先,JavaScript是一种基于Java基本语句和控制流之上的简单而紧凑的设计,从而对于使用者学习Java或其他C语系的编程语言是一种非常好的过渡,而对于具有C语系编程功底的程序员来说,JavaScript上手也非常容易;其次,其变量类型是采用弱类型,并未使用严格的数据类型。
(4).一种相对安全脚本语言。
JavaScript作为一种安全性语言,不被允许访问本地的硬盘,且不能将数据存入服务器,不允许对网络文档进行修改和删除,只能通过浏览器实现信息浏览或动态交互。从而有效地防止数据的丢失或对系统的非法访问。
(5).一种事件驱动脚本语言。
JavaScript对用户的响应,是以事件驱动的方式进行的。在网页(Web Page)中执行了某种操作所产生的动作,被称为“事件”(Event)。例如按下鼠标、移动窗口、选择菜单等都可以被视为事件。当事件发生后,可能会引起相应的事件响应,执行某些对应的脚本,这种机制被称为“事件驱动”。
(6).一种跨平台性脚本语言。
JavaScript依赖于浏览器本身,与操作环境无关,只要计算机能运行浏览器,并支持JavaScript的浏览器,就可正确执行,从而实现了“编写一次,走遍天下”的梦想。
3. JavaScript的优缺点
(1).JavaScript的优点:
<1>.JavaScript减少网络传输。
在JavaScript这样的用户端脚本语言出现之前,传统的数据提交和验证工作均由用户端浏览器通过网络传输到服务器上进行。如果数据量很大,这对于网络和服务器的资源来说实在是一种无形的浪费。而使用JavaScript就可以在客户端进行数据验证。
<2>.JavaScript方便操纵HTML对象。
JavaScript可以方便地操纵各种页面中的对象,用户可以使用JavaScript来控制页面中各个元素的外观、状态甚至运行方式,JavaScript可以根据用户的需要“定制”浏览器,从而使网页更加友好。
<3>.JavaScript支持分布式运算。
JavaScript可以使多种任务仅在用户端就可以完成,而不需要网络和服务器的参与,从而支持分布式的运算和处理。
(2).JavaScript的局限性:
<1>.各浏览器厂商对JavaScript支持程度不同
目前在互联网上有很多浏览器,如Firefox、Internet Explorer、Opera等,但每种浏览器支持JavaScript的程度是不一样的,不同的浏览器在浏览一个带有JavaScript脚本的主页时,由于对JavaScript的支持稍有不同,其效果会有一定的差距,有时甚至会显示不出来。
<2>.“Web安全性”对JavaScript一些功能牺牲。
当把JavaScript的一个设计目标设定为“Web安全性”时,就需要牺牲JavaScript的一些功能。因此,纯粹的JavaScript将不能打开、读写和保存用户计算机上的文件。其有权访问的唯一信息就是该JavaScript所嵌入的那个Web主页中的信息
网友评论