// 字符串模板 是1前面的那个键 ``
//进行字符串的链接操作
let name = "张三疯";
let age = 18;
//在字符串里面使用变量
let str = '名字:'+name+',年龄是:'+age+'';
//但是在ES6里面是可以这样进行拼接的
let strs = `名字叫做${name},年龄是${age}`
console.log(str)
console.log(strs)
//模拟字符串模板的 作用
let data = [
{title: "465654645654645",read: 10},
{title: "987465645645654",read: 200},
{title: "489846545646565516",read: 500}
]
//请求的资源都加载完之后才会触发事件函数里面的代码,注意与jq中ready事件的三点区别,继续加油吧!
window.onload = function() {
//得到dom对象
let oUL = document.querySelector('#uls')
for(let i =0; i<data.length; i++) {
let Oli = document.createElement("li");
Oli.innerHTML = `<span>这是一段文字的描述${data[i].title}</span><span>这是一段文字的描述${data[i].read}</span>`
oUL.appendChild(Oli)
}
}
//字符串的查找 indexof ES6 includes
// str.indexOf(要找的东西) 返回的索引位置 没找到 但会-1
// str.includes(要找的东西) 返回值 true/false
//字符串是否以谁开头 str.startsWith("")
let string = "httplocalhost:8080";
let stras = string.startsWith("http")
//是否结尾
let stras2 = string.endsWith("80")
console.log(stras)
//判断字符串是否以谁进行来结尾 str.endsWith
console.log(stras2)
//重复字符串
let str3 = "强哥";
console.log(str3.repeat(3));
//ES8字符串填充 str.padStart(真个字符串长度,填充东西)
//str.padEnd(真个字符串长度,填充东西)
let i = 'apples'
let j = 'orange'
console.log(i.padStart(i.length+j.length,j))
函数 的默认参数 箭头函数 剩余参数
//1.给函数的参数 设置默认值 非常好用
function show(a="第一个参数不能为空",b="第二个参数不能为空") {
//以前的 写法
// a = a || "第一个参数不能为空"
// b = b || "第二个参数不能为空!!"
console.log(a,b)
}
show("aaa","bbbb")
show("aaa")
// show("","bbbb")
//下面是进行小练习
function fn({x='这个是x的默认值',y='这个是y的默认值'}={}) { //这边进行解构
console.log(x,y)
}
fn({x:100,y:200})
fn({x:400})
fn({y:400})
fn() //{x='这个是x的默认值',y='这个是y的默认值'}={} 这个前面的大括号是一个对象 相当于a
//2.函数参数默认已经定义了 不能在使用let,const进行在申明了 不然报错 使用var的话就会直接覆盖
// function func(arg) {
// let arg = 777;
// console.log(arg)
// }
// func(666)
//3.rest(重置)运算符 扩展运算符
// ... 展开运算符
let array = ['banana','orange','dog'];
console.log(array)
console.log(...array) //这样就把数组展开来了 还可以进行重置
//下面是函数进行传参 可以把数组展示出来
function g(...c){ //这样参数里面就不要 写诗歌参数了
console.log(c)
}
g(1,2,3,4,5,6,7,8,9,10) //这边传递过去相当于 ...g
//练习小排序
function dailogs(...n){ //这边因为场地进去的是一个数组
console.log(n.sort())
}
dailogs(1,341,34,12,934,23)
//当剩余参数来进行使用
function m(o,...p) {
console.log(o)
console.log(p) //这样可以把 数组 得到数组里面剩余的数据
}
m(12,324,32)
//试一下对象可以使用三个点吗
// let data = {
// aaaa: 22,
// bbbb: 444,
// cccc: 5555
// }
// console.log(...data) 这样使用就会报错了 ...现在只适用于数组
//4.最重要的箭头函数 =>
// () => { 语句 return;}
let funcc=(a="12",b="23") => {
console.log(a,b)
return a+b //凡是用大括号括起来的部分如果想拿到返回值就必须用return关键字返回,否则返回undefined。
}
funcc()
//****当在箭头函数里面使用this的时候 这个this只是指向这个json对象里面的数据
//箭头函数里面没有 arguments,用 "..."
//箭头不能当构造函数构造函数