模板字符串
带标签的模板的字符串
const name = 'tom'
const gender = false
// 通过标签函数,获取模板字符串传递进来的值,可以将这个结果进行处理,返回出去
function tagFn(str, name, gender) {
console.log(str)
console.log(name)
console.log(gender)
return '111'
}
const res = tagFn`hello, my name is ${name}, my sex is${gender}`
字符串拓展方法
判断字符串是否包含某个字符
const msg = 'hello world'
msg.includes('world') // true
判断字符串是否以某个字符开头,或以某个字符结尾
const msg = 'hello world'
msg.startsWith('h') // true
msg.endsWith('d') // true
Reflect
提供一套统一操作对象的API,例如,像下面操作一个对象
const obj = {
name: 'hi',
age: 18
}
// 判断某个属性是否在对象里
console.log('name' in obj)
// 删除对象某个属性
console.log(delete obj.name)
// 将对象的属性名提取成数组
console.log(Object.keys(obj))
从上面的实现方法可以看出,操作一个对象,用的方法很乱,一下用 in
一下用 delete
,一下用Object上的方法,同样操作一个对象,没有统一性,换成用 Reflect
实现:
const obj = {
name: 'hi',
age: 18
}
// 判断某个属性是否在对象里
console.log(Reflect.has(obj, 'name'))
// 删除对象某个属性
console.log(Reflect.deleteProperty(obj, 'name'))
// 将对象的属性名提取成数组
console.log(Reflect.ownKeys(obj))
Map数据结构
有下面的一个例子,将 对象
作为另一个对象的键存入,但是实际打印结果不如所愿:
const obj = {}
obj[{ name: 'tom' }] = 'Tom'
console.log(obj) // { [object Object]: "Tom" }
无论传入什么数据当作属性名,都会强制转换成字符串,转换不了的会转换成 [object Object]
,而通过Map数据映射结构就没有这种问题
const map = new Map()
const tom = {
name: 'tom'
}
map.set(tom, 'Tom')
console.log(map.get(tom))
Symbol
Symbol
是一个基本数据类型,主要用于创建一个独一无二的值
console.log(Symbol() === Symbol()) // false,永远不可能有两个相等的Symbol
在没有Symbol之前,一个对象里面,很有可能会存入属性名相同的两个属性,例如
// 例如这是一个全局公用的缓存对象
const cache = {}
...
cache['file_cache'] = 'xxx'
...
// 代码多了后,可能就不知道cache里面有个file_cache的缓存名,然后继续存入file_cache缓存名,此时就会将之前传入的缓存给覆盖掉,因此就可能会出现问题
cache['file_cache'] = 'ooo'
将上方缓存改成 Symbol
去实现:
// 例如这是一个全局公用的缓存对象
const cache = {}
...
// 括号里的是对这个Symbol的描述
cache[Symbol('file_cache')] = 'xxx'
...
cache[Symbol('file_cache')] = 'ooo'
/*
*
* {
* Symbol(file_cache): "xxx"
* Symbol(file_cache): "ooo"
* }
*
*/
Symbol
还可以作为对象的私有成员,让外界去无法访问
var People = (function() {
var name = Symbol("name");
class People {
constructor(n) { //构造函数
this[name] = n;
}
sayName() {
console.log(this[name]);
}
}
return People;
})();
Symbol内置属性
1、控制instanceof的返回值
class Person {
static [Symbol.hasInstance](params) {
console.log(params)
console.log("我被用来检测")
return false
}
}
let o = {}
console.log(o instanceof Person)
Symbol的一些补充
1、创建的Symbol属性,永远 不相等
console.log(Symbol() === Symbol()) // false
2、注册全局的Symbol,注册全局的Symbol,接收一个字符串,如果不是字符串会转换成字符串,相同的字符串生成的全局Symbol会 相等
const s1 = Symbol.for('s1')
const s2 = Symbol.for('s1')
console.log(s1 === s2) // true
console.log(Symbol.for(true) === Symbol.for('true')) // true
3、对象内的Symbol,通过传统的获取,是 获取不到
的
const obj = {
[Symbol('hi')]: 'hi',
name: 'hello'
}
for(let key in obj) {
console.log(key) // name
}
// 如果想获取Symbol,需要通过Object.getOwnPropertySymbols()方法
console.log(Object.getOwnPropertySymbols(obj))
生成器 Generator
function *fn() {
console.log(111)
yield 100
console.log(222)
yield 200
console.log(333)
yield 300
}
var g = fn()
// 调用一次,执行一次
g.next() // 100 {value: 100, done: false}
使用生成器实现一个自增的id
function *createId() {
let id = 1
while(true) {
yield id++
}
}
var c = createId()
c.next() // 1
c.next() // 2
c.next() // 3
generator传参
function *fn(arg) {
console.log(arg)
let one = yield 100
console.log(one)
let two = yield 100
console.log(two)
let three = yield 300
console.log(three)
}
var g = fn('arg') // 会传入到arg处
g.next()
g.next('aaa') // 会传入到one的位置
g.next('bbb') // 会传入到two的位置
g.next('ccc') // 会传入到three的位置
使用生成器实现迭代器
let todos = {
life: ['吃饭', '睡觉'],
study: ['语文', '数学', '英语'],
[Symbol.iterator]: function* () {
const all = [...this.life, ...this.study]
for (let item of all) {
yield item
}
}
}
for (let item of todos) {
console.log(item);
}
使用生成器实现按顺序调用 用户信息 -> 订单信息 -> 商品信息 接口
function getUser() {
setTimeout(() => {
let data = '用户信息'
iterator.next(data)
}, 1000)
}
function getOrder() {
setTimeout(() => {
let data = '订单信息'
iterator.next(data)
}, 1000)
}
function getGoods() {
setTimeout(() => {
let data = '商品信息'
iterator.next(data)
}, 1000)
}
function* fn() {
let user = yield getUser()
console.log(user);
let order = yield getOrder()
console.log(order);
let goods = yield getGoods()
console.log(goods);
}
let iterator = fn()
iterator.next()
数组includes方法与indexOf的区别
indexOf无法查找NaN的情况
const arr = ['foo', NaN, null]
arr.indexOf(NaN) // -1
使用includes可以查找出
const arr = ['foo', NaN, null]
arr.includes(NaN) // true
class中将属性挂载到实例身上
class Person {
name = '杜恒'
say = function() {
console.log(1)
}
}
class中static关键字的作用
static
关键字定义的属性,是属于类上面的,而不是实例化出来的对象上面
class Person {
static name = 'hello'
}
const p = new Person()
console.log(p.name) // undefined
console.log(Person.name) // hello
Object.entries & Object.fromEntries
将对象转换成二维数组
const obj = {
name: '杜恒',
age: 23
}
const res = Object.entries(obj)
console.log(res) // [ ["name", "杜恒"], ["age", 23] ]
将二维数组、Map转换成普通对象
const map = new Map()
map.set("name", "杜恒")
map.set("age", 23)
console.log(map)
const res = Object.fromEntries(map)
console.log(res)
Promise.allSettled
Promise.allSettled用于接收一个数组, 与Promise.all很像,但是Promis.all是所有结果为成功状态,才返回成功。而Promise.allSellted是无论有没有失败情况下,都返回成功
globalThis
无论在什么环境下,globalThis都指向全局对象
I admire you, you little retard
shit bro
亚麻跌
名孩子老婆呢视频
评论区都是歪果仁
评论区已被歪果仁占领
I visited multiple web pages however the audio quality for audio songs existing at this site is actually excellent.
Hi it's me, I am also visiting this website daily, this web site is truly nice and the people are genuinely sharing good thoughts.