笔记文章开头加两句话：（(●ˇ∀ˇ●)没想到把，我也把这句话复制过来了，哈哈哈）
- 本文参加了由公众号@若川视野 发起的每周源码共读活动， 点击了解详情一起参与。
- 这是源码共读的第36期，链接：第36期 | omit.js 剔除对象中的属性。
新东西
- Father
- @umijs/fabric
- np
Father
基于 rollup、docz、storybook、jest、prettier 和 eslint 的库工具包
@umijs/fabric
eslint、prettier 、studylint 的配置库
np
一个 管理 npm 发布流程的 package
需要学的东西很多，这里只作记录暂不作深究
重点
Object 类型 的 遍历访问示例
作者 最近 在阅读 红宝书，感觉 收获甚多 所以 对 若川的 36期 源码 的遍历 合成 一个 新对象 函数 的 代码 有 新的 体会。特此，记录，以便 梳理知识。
作者 学历水平 不高 。部分表达 存在 语病 请多指教。
对象在
js中属于基础里的基础，了解对象的特性，才能更好写出没有bug的代码。
for...in 遍历 对象 属性
for in 遍历 对象的 实例和原型链上所有原型中可枚举、非Symbol的属性
// class 有两种方式创建 关键字创建 还有 表达式创建
const ForInClass=new Class{
constrouctor(name,age){
this.name=name
this['age']=age;
}
sayName(){
console.log(this.name);
}
}
//字面量访问
ForInClass.protoType['protoTypeAttr']="protoType"
const myClassInstance=new ForInClass('我',22);
for(const key in myClassInstance){
console.log("for in 举例 的 可 枚举 对象",key);
}
Object.keys、Object.values、Object.entries 返回自身所有的可枚举的属性的数组，数组本身也是作为一个可迭代对象。
可迭代对象的访问方式
const oEntries=Object.keys({nane:"我",age:22});
//for of 访问
for(const key of oEntries){
}
//伪数组转数组
Array.from(oEntries);
//迭代器 API
function * gen{
yield * oEntries;
}
// 扩展
[...oEntries];
...
//发现还有其它可接受可迭代对象
// Map Set
//Promise.all Promise.race
getOwnPropertyNames、getOwnPropertySymbols 返回实例自身的属性
萌新搞错了这一块。getOwnProperyNames 返回对象自身所有非Symbol的键值，包括不可枚举。
getOwnPropertySymbols 返回自身所有的 Symbol键。
另外开发者默认设置的属性是 可枚举的 (enumable) ,我们可以通过Object.defineProperite(s)定制属性的操作特性。
const obj={
name:'name',
[Symbol('name')]:'name',
};
//['name']
Object.getOwnPropertyName(obj);
//[Symbol('name')];
Object.getOwnPropertySymbols(obj);
get \ set
属性的访问、获取的相关的设置
- 只读设置，但不太优雅
- 基于属性的get or set 的观察者
- 计算属性
- ...
Object.getPrototypeOf\instanceof\Object.isPrototypeOf
- getPrototypeOf 主要是用来获取某个变量的原型，类式于
[[Prototype]]属性。 - instanceof 和 Object.isPrototypeOf 都是来判断是否在于原型上。 但区别主要在于 instanceof 是用 构造函数判定，Object.isPrototypeOf主要是用来构造原型上的判断。
ts
泛型
//<T,...泛型>,由
function fn<T>(arg:T):T{
//对应逻辑，采用类型守卫和类型收窄处理
return arg;
}
type forEachType<>=T.number
exteneds
// 继承
enum size{
big,
}
interface bag{
color:string
}
interface bigBag extends bag{
size:size.big
}
// 泛型约束
type book=<T extends {{page:number}}>
// 类型分配
interface book={
name:string,
page:number
};
interface ProgramBook{
name:string,
page:number,
type:string,
}
type bool=book extends ProgramBook ? true:false
keyof
keyof T 返回类型的所有键的枚举类型
is
返回一个确定类型，在条件执行语句中可以明确该类型，选择对应类型推导。
- 类型守卫
function isString<T>(arg:T):arg is string(){return type arg};
in
- 类型收窄
type man={
name:string,
sex:'man',
playTel(){}
};
type fireman={
name:string,
sex:'man',
major:"fireman"
work(){}
}
function(arg:man|fireman){
//fire
'major' in fireman?fireman.work():man.playTel(119);
}
- 映射类型
type obj{
readonly name:string;
age:number
}
type objreadonly<T>={
readonly[K in keyof T]:T[K]
}
前言
- 有什么错误/不足，就在评论说一下，我整改一下。
感言
- 红宝书 从 我 难以理解的晦涩 ，到现在 收获颇多 。这个过程，如果 没有 一定的 积累，恐怕 也无法 读出感觉，读出收获。
- 这也是 我第一次 参与 在掘金平台的 文章。
- 这是我对部分js知识边缘的整理和总结。
- 时间挺赶的，暂时改动这些地方。
资料来源
- 红宝书
P231-223 - 掘金ts文章
