前端后端一锅端4- 含chrome构架图

无哥

已于 2023-01-02 22:50:02 修改

阅读量82

点赞数

分类专栏： web 文章标签：前端 chrome javascript

于 2022-12-30 23:21:05 首次发布

本文链接：https://blog.csdn.net/willerwu/article/details/128501482

版权

web 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

前端后端一锅端4

chrome architecture
javascript engine
https://jhalon.github.io/chrome-browser-exploitation-1/

+-------------------------------------------------------------------------------------+
| Google Chrome                                                                       |
| +----------------------------------------+          +---------------------------+   |
| | Google V8                              |          |                           |   |
| | +-------------+ +---------------+      |          |      WebAPIs              |   |
| | |    Heap     | |     Stack     |      |          |                           |   |
| | +-------------+ +---------------+      |          |                           |   |
| +----------------------------------------+          +---------------------------+   |    
| +---------------------+     +-------------------------------------+                 |
| |     Event loop      |     |          Task/Callback queue        |                 |
| |                     |     |                                     |                 |
| +---------------------+     +-------------------------------------+                 |
|                             +-------------------------------------+                 |
|                             |          Microtask queue            |                 |
|                             +-------------------------------------+                 |      
+-------------------------------------------------------------------------------------+

宏观和微观相结合来看。

vscode 2022/12/31
Alt+← 返回上一步:
ctrl + Enter 跳转下一行开头
@Component({
selector: ‘app-root’,
//这个组件可以通过app-root这个HTML标签来调用，在这里面来展示组件的内容
div 中id和class

1.定义区别。
(1).id具有唯一性，在一个网页中只能定义一次；
(2).class命名的类，可以出现多次。
2.使用区别。
(1).id在CSS中是以“#”开头的命名的；
(2).class在css中是以“.”开头命名的；
PS：
1.一般来说，id是元素的唯一代号，给某个元素赋予一个id后，通常不会再有其他元素有一样的id。CSS和JavaScript可以使用id来单独操作某一个元素;而class是一组（多于一个）元素的共同代号，通常网页中会有一组元素具有一样的class。CSS和JavaScript中对某个class的操作会反映到每一个对应的元素上。
2.ID是一个标签，用于区分不同的结构和内容，就象名字，如果一个屋子有2个人同名，就会出现混淆；class是一个样式，可以套在任何结构和内容上，就象一件衣服；
从概念上说就是不一样的：id是先找到结构/内容，再给它定义样式；class是先定义好一种样式，再套给多个结构/内容。
————————————————
版权声明：本文为CSDN博主「程序员七哥」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/zxw136511485/article/details/71191053

结构型指令简写形式： <div *ngFor=“let msg of hookLog” class=“log”>{{msg}}
三种情况（ngModel）: input --> 组件事件绑定、[ngModel]: 组件–> input 属性绑定、([ngModel]): 双向
方括号[]用来传递输入->属性绑定，圆括号()用来处理输出->事件绑定
数据通过输入绑定流入你的组件，事件通过输出绑定流出你的组件
刷屏`

  // schedules a view refresh to ensure display catches up
  tick() {  this.tick_then(() => { }); }
  tick_then(fn: () => any) { setTimeout(fn, 0); }`
  setTimeout(f,0)将第二个参数设为0，作用是让f在现有的任务（脚本的同步任务和“任务队列”中已有的事件）一结束就立刻执行。也就是说，setTimeout(f,0)的作用是，尽可能早地执行指定的任务。setTimeout(f,0)指定的任务，最早也要到下一次Event Loop才会执行。
 -. 调整事件的发生顺序
 -. 分割耗时任何，实现伪多线程的概念

<do-check [hero]=“hero” [power]=“power”> < /do-check>??没搞懂？2023/1/1

  Usage: <div appSpy>....< /div> 
   @Directive({selector: '*[appSpy*]'}) =>风格这样做好么?，如何交叉引用？

生命周期钩子中的例子：<on-changes [hero]=“hero” [power]=“power”>，怎么少一次事件触发呢？怎么解决？现在不知道.
视图封装: 不懂
组件之间的交互：名字绑定好乱。。。

@Component({
  selector: 'app-hero-parent',
  template: `
    <h2>{{master}} controls {{heroes.length}} heroes</h2>

    <app-hero-child
      *ngFor="let hero of heroes"
      [hero1]="hero" //前面是child的引用变量，后是自己的本地变量？
      [master1]="master">
    </app-hero-child>
  `
})
export class HeroParentComponent {
  heroes = HEROES;
  master = 'Master';
}

在 Angular 中，模板就是一块 HTML。
a.文本插值：插值使用双花括号 {{ 和 }} 作为定界符
b.模板语句：<button type=“button” (click)=“deleteHero()”>Delete hero，单击 Delete hero 按钮时，调用组件类中 deleteHero() 方法
c.绑定始终有两部分：将接收绑定值的目标和从模型生成值的模板表达式。
–. 文本插值,属性绑定,事件绑定,双向绑定
–. 模板表达式不能引用全局命名空间中的任何东西, 不能引用 window 或 document。此外，它们不能调用 console.log() 或 Math.max()
–. 上下文对象,命名冲突，好恶心，这种用法。
–.Attribute 绑定:<p [attr.attribute-you-are-targeting]=“expression”>
–. colspan 是的 Attibute，而带有大写 “S” 的 colSpan 是 Property。这样做好么？是不是老美在下套？整个这种?死记住？坑爹
–.类和样式绑定
–. 绑定到被动事件:想优化导致性能问题的频繁发生的事件，可能会发现这很有用

管道的优先级