const hello1 = name => {
console.log(hello ${name}
)
}
hello(‘胡’)
hello1(‘胡’)
函数只有一条return语句
// 如果函数只有一条return语句
const double = x=>x*2 //只有一条return 语句可以简写成这样
console.log(double(5)) // 10
函数参数赋值
// 参数赋值
const fuzhi = ( name = “胡庆虎”) => {
console.log(hello ${name}
)
}
fuzhi()
fuzhi(“假的胡庆虎”)
函数参数展开
//函数参数展开
function zhankai (name1,name2) {
console.log( name1,name2)
}
let arr = [‘小明’,‘小王’]
// zhankai.apply(null,arr) //小明 小王
zhankai(…arr) //小明 小王
模板字符串
拼接字符串过于繁琐,用模板字符串非常简单!
let name = “虎宝宝”
course = “在总结es6”
console.log('hello ’ + name + ‘现在’ + course)
console.log(hello ${name} 现在 ${course}
)
解构赋值
let [x,y] = [4,8]
console.log(…[4,8])//4 8
let arr1 = [1,3]
let arr2 = [4,6]
console.log(concat:${arr1.concat(arr2)}
)//[1,3,4,6]
// […arr1,…arr2] //[1,3,4,6]
//对数组的解构
let [a,…b] = [1,2,3,4] //a:1,b:[2,3,4]
const arr = [‘hello’,‘immoc’]
let [arg1,arg2] = arr //批量赋值
console.log(arg1,arg2) //hello immoc
//对对象的解构
const obj = {
name : ‘immoc’,
course : ‘在学习’
}
let {name,course} = obj
console.log(name,course) //immoc 在学习
//对字符串的解构
let [c,d,f] = “ES6” //c:E,d:S,f:6
let xy = […‘ES6’] //[“E”, “S”, “6”]
对象的拓展
知识点:
1.Object.keys values entries
2.对象方法简写,计算属性
3.展开运算符(不是es6标准,但是bable支持
Object.keys values entries
let obj = {
name:“杨柳”,
age:20
}
//获取obj的所有key
console.log(Object.keys(obj)) //[“name”, “age”]
//获取obj的所有values
console.log(Object.values(obj)) //[“杨柳”, 20]
//获取obj的key和values注意,结果是个二维数组
console.log(Object.entries(obj)) //[[“name”, “杨柳”],[“age”, 20]]
对象计算属性
//计算属性
const name = ‘imooc’
let obj1 = {
[name]:‘hello’ //不加[]就输出{name: “hello”, imooc: “hello imooc”},加了输出{imooc: “hello imooc”}
}
obj1[name] = ‘hello imooc’
console.log(obj1)
let obj2 = {
name,//就是name:name
hello:function(){
},
hello1(){//等价于上面的hello
},
}
let obj3 = {
name:“杨柳”,
age:20
}
let obj4 = {
type:“test”,
name:‘woniu’
}
// console.log(obj3)
console.log({…obj3,…obj4,data:2017}) //{name: “woniu”, age: 20, type: “test”, data: 2017}
Class的用法
class MyApp {
constructor () {
this.name = ‘immoc’
}
sayHello(){
console.log(hello ${this.name}
)
}
}
const app = new MyApp
app.sayHello() //hello immoc
Promise的用处
let checkLogin = () => {
return new Promise((resolve,reject)=>{
let flag = document.cookie.indexOf(“userId”) > -1 ? true : false;
if(flag=true){
resolve({
status:0,
result:true
})
}else{
reject(“error”)
}
})
}
let getUserInfo = () => {
return new Promise (( resolve,reject)=>{
let userInfo = {
userId: ‘101’,
}
resolve(userInfo)
})
}
checkLogin().then((res)=>{
if(res.status == 0){
console.log(‘login success’)
return getUserInfo()
}
}).catch((err)=>{
console.log(err:${err}
)
}).then((res2)=>{//链式调用
console.log(userId:${res2.userId}
)
})
Promise.all([checkLogin(),getUserInfo()]).then(([res1,res2]) => {
console.log(res1:${res1.result},res2:${res2.userId}
)
})
常见代码片段
数组的:
/* 数组 */
自我介绍一下,小编13年上海交大毕业,曾经在小公司待过,也去过华为、OPPO等大厂,18年进入阿里一直到现在。
深知大多数前端工程师,想要提升技能,往往是自己摸索成长或者是报班学习,但对于培训机构动则几千的学费,着实压力不小。自己不成体系的自学效果低效又漫长,而且极易碰到天花板技术停滞不前!
因此收集整理了一份《2024年Web前端开发全套学习资料》,初衷也很简单,就是希望能够帮助到想自学提升又不知道该从何学起的朋友,同时减轻大家的负担。
既有适合小白学习的零基础资料,也有适合3年以上经验的小伙伴深入学习提升的进阶课程,基本涵盖了95%以上前端开发知识点,真正体系化!
由于文件比较大,这里只是将部分目录截图出来,每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频,并且会持续更新!
如果你觉得这些内容对你有帮助,可以扫码获取!!(备注:前端)
最后
由于文档内容过多,为了避免影响到大家的阅读体验,在此只以截图展示部分内容,详细完整版的JavaScript面试题文档,或更多前端资料可以点此处免费获取。
以上前端开发知识点,真正体系化!**
[外链图片转存中…(img-A9exL3DM-1713484902263)]
由于文件比较大,这里只是将部分目录截图出来,每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频,并且会持续更新!
如果你觉得这些内容对你有帮助,可以扫码获取!!(备注:前端)
[外链图片转存中…(img-6m4AIWFx-1713484902263)]
最后
[外链图片转存中…(img-hj0xl4OI-1713484902263)]
[外链图片转存中…(img-pT2gY1Tl-1713484902264)]
由于文档内容过多,为了避免影响到大家的阅读体验,在此只以截图展示部分内容,详细完整版的JavaScript面试题文档,或更多前端资料可以点此处免费获取。