文章15
标签3
分类5

五款精品软件推荐

look scanned

如果你需要扫描文件文档,但是身边又没有打印机的情况下,你就可以使用 look scanned 就可以轻松搞定了,它可以让你的 pdf 文件看起来被扫描过一样。免费开源程序,支持本地离线使用。

lossless-cut

免费开源的无损视频切割器,它支持截取,合并,剪辑视频片段等等,速度很快,不会二次压缩,转码,可以在 win ,linux ,mac 系统上使用。

美化电脑桌面外观

你可以在你的桌面自定义图标摆放位置,任务栏透明等等。

小丸工具箱

小丸工具箱是一款用于处理音视频等多媒体文件的软件。是一款x264、ffmpeg等命令行程序的图形界面。它的目标是让视频压制变得简单、轻松。

小丸拾色器

小丸拾色器,小而精致简单实用的取颜色代码,具体官网没有找到

观书《你不知道的JavaScript》上卷

  • [ ] 我会记录一些我认为重要的语句,这些都是出自这本书内容的。 我建议大家还是阅读一下这部书 我记录的只是我认为很重要的 比如像模块化那些闭包例子大家还是跟着书上的案例练习一下 待续--------

变量声明

变量的赋值操作会执行两个动作,当然我们都称之为声明。首先编译器会在当前作用域中声明一个变量(如果之前没有声明过),然后在运行时引擎会在作用域中查找该变量,如果能够找到就会对它赋值

欺骗词法

如果词法作用域完全由写代码期间函数所声明的位置来定义,怎样才能在运行时来"修改"词法作用域呢?

JavaScript中有两个机制可以“欺骗”词法作用域:eval(...)和with。前者可以对一段包含一个或多个声明的"代码"字符串进行演算。并借此来修改已存在的作用域。而with本质上是通过将一个对象的引用当中作用域来处理,将对象的属性当作作用域的标识符来处理,从而创建一个新的词法作用域(同样在运行时)

不要使用它们,使用这其中如何一个机制都将导致代码运行变慢

函数声明和函数表达式

function bar(){} (function bar(){})();

区分函数声明和表达式最简单的方法是看function关键字出现在声明中的位置(不仅仅是一行代码,而是整个声明中的位置.)如果function是声明中的第一个词,那么就是一个函数声明,否则就是一个函数表达式.

setTimeout 叫做匿名函数表达式

setTimeout(function timoutHandlr(){},1000) 叫做 行内函数表达式

循环与闭包

<script type="text/javascript">
             for(var i = 1;i<=5;i++){
                 setTimeout(function timer(){
                     console.log(i)
                 },i * 1000)
             }
        </script>

输出结果是 五次6 。这个循环的终止条件是 i 不再<=5.条件首次成立时i的值是6.因此 输出显示的最终值是6 所有的回调函数依然是循环结束后才会被执行.因此这里会输出五个6

类型

  • string
  • number
  • Boolean
  • null
  • undefined
  • Object

string number null object undefined (本身都不是对象) null有时会被当作一个对象类型,但是它其实是语言本身的一个bug,即对null执行 typeof null 会返回 ‘’object .实际上 null本身是基本类型

内置对象

  • String
  • Number
  • Boolean
  • Object
  • Function
  • Array
  • Date
  • RegExp
  • Error

this

如果要判断一个运行中函数的this绑定,就需要找到这个函数的直接调用位置.找到之后就可以顺序应用下面这四条规则来判断this的绑定对象。

  • 由new调用?绑定到新创建的对象。
  • 由call 或者 apply 或者(bind)调用?绑定到指定的对象。
  • 由上下文对象调用?绑定到那个上下文对象。
  • 默认:在严格模式下绑定到undefined,负责绑定到全局对象

属性描述符

浅拷贝:ES6提供了Object. Assign(方法的第一个参数是目标对象,之后还可以跟多个源对象,它会遍历源对象)

属性描述符三个特性:writable(可写 决定是否可以修改属性的值) enumerable(可枚举)configurable(可配置)

Object.defineProperty()来添加一个新属性或者修改一个已有属性

var myObject={}
Object.defineProperty(myObject,'a',{
value:2,
writable:true,
configurable:true,
enumerable:true
});
myobject.a //2

new

当您在普通的函数调用前面加上 new 关键字之后,就会把这个函数调用变成一个“构造函数调用”。实际上 new 会劫持所有普通函数并用构造函数对象的形式来调用它。

当 new 时,函数调用会变成“构造函数调用”构造出来赋值的那个对象.constructor 通过默认的【【Prototype】】 委托指向 new 的那个函数

### instanceof

处理对象和函数 .prototype 引用 之间的关系。

class

class 只是现有 [[prototype]] (委托!)机制的一种语法糖。

预编译

  • 创建AO对象
  • 将形参和变量声明 值为underfunded
  • 将形参和实参值统一
  • 在函数体里找函数声明,值赋给函数体

记录一下面试遇到的题。

数组遍历 map 与 filter 不 return 的区别

map 为返回 为 undefined 的一个数组 它的 length 为 map的length。

filter 返回 一个空的数组

待续

这几天面试了4家,有两家正规的面试没有,有家试岗3天还没有工资,依据我国相关法律的规定,试岗期没有工资肯定是不合法的,劳动者在试用期的,用人单位应该按不得低于本单位相同岗位最低档工资或者劳动合同约定工资的百分之八十支付工资。(=-=)感觉就不是很靠谱。

还有一家给我的感觉像培训,口号就是如果你希望学习到技术,就来,不是奔着钱来的。其实钱不钱的无所谓,关键你这太脱离现实了。要知道一切离开现实或者是脱离了标准,都是空谈,下次换个口号,你就说找初级也行啊。我也没去面。

还有一家,不知道为什么,一直在说我的年龄问题,我觉得我年龄小,跟技术没什么关系。还说我已经具备了工作的能力,然而一直没给我反馈,我觉得不管是过没过,你至少得给我反馈吧,或者什么什么的,这浪费了我的时间,还有你的时间,你面试我难道就是为了玩吗?调侃我吗?

还有一家是 React 的,我承认我 react 只会用,你如果想让我说原理,我是真的只能说不出大概个所以然。

总结

程序员还得不断的学习,面4家两周有这些 机会 很不错了,还不能入职是我的原因吧,以后会继续努力的学习,不管如何,脚踏实地。一个月就快要过去了,我已经快自闭了,现在生活都是个问题,我能做什么呢这个是问题,先找到工作是我的首要目标。

现在国家提倡学生继续读书,本考研的考研,失业率这几年最高的,当然我们国家叫 灵活就业,不可能一群人跟你说天下太平就真的太平了,需要有人站出来说这些。 实事求是 追求真理,有时候我们真的该反思了一下了。love.jpg

2022复习vue2学习vue3

vue 是一款友好的,多用途且高性能的 JavaScript 框架,它可以帮你创建 可维护性和可测试性更强的代码库。

vue 是渐进式的 JavaScript 框架。本文档只记录 一些概念或者做法,从 vue 文档记录。

交互

我们写的方法中,更新了应用的状态,但没有触碰 DOM 所有的 DOM 操作都由 Vue 来处理,你编写的代码只需要关注逻辑层面即可。

组件

组件系统是 vue 的另一个重要概念,因为它是一种抽象,允许我们使用小型,独立和通常可复用的组件构建大型应用。仔细想想,几乎任意类型的应用界面都可以抽象为一个组件树;

MVVM

MVVMModel–view–viewmodel)是一种软件架构模式

MVVM有助于将图形用户界面的开发与业务逻辑后端逻辑(数据模型)的开发分离开来。是一种设计模式的变体。

当一个 vue 实例被创建时,它将 data 对象中的所有的 property 加入到 Vue 的响应式系统中,当这些 property 的值发生改变时,视图将会产生“响应”,即匹配更新为新的值。

生命周期

每个 vue 实例在被创建时都要经过一系列的初始化过程--。数据监听 编译模板,将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这些过程运行一些叫做 生命周期的函数,这给了用户在不同阶段添加到自己的代码的机会。

本质上:每个主要 vue 生命周期事件被分成两个钩子,分别在事件之前和之后调用。 vue 应用程序中有 4 个主要事件(8个主要钩子)

  • 创建 - 在组件创建时执行
  • 挂载 - DOM 被挂载时执行
  • 更新 - 当响应数据被修改时执行
  • 销毁 - 在元素被销毁之前立即执行

beforeCreate 创建之前,访问不到data中的变量的。

create Dom 还没有编译,但是 vue 实例数据和方法可以访问了。

beforeMount 触发在编译 Dom 阶段的,编译模板阶段。我们在这个钩子对页面元素内容是不能修改的。

Mounted 页面挂载完毕之后,这时候我们就可以修改 DOM,已经可以看到页面了。在 mounted 构造函数之后,vue 实例已经创建完毕了,就进行运行阶段了。

这里我要说一下,对Vue的数据更新页面改变的理解,Vue的实例中比如data里面的数据的话,我们假如插值在页面上的话,我们修改这个数据,它不是及时渲染到页面上面的,它是在内存中对之前的虚拟DOM中的data数据进行更改,生成新的虚拟DOM之后才会渲染到页面上。

beforeUpdate 更改data数据后,当虚拟DOM中的data发生改变时触发,此时虚拟DOM没有加载到页面上。页面上的数据不变,虚拟DOM中的数据改变。

Updated 更改data数据之后,虚拟DOM中的data发生改变页面上的data也发生改变(即新生成的虚拟DOM挂载上页面了)

销毁阶段

beforeDestroy------------销毁前执行的钩子函数,可以继续使用vue实例中的数据。
destroyed------------------已经销毁了,vue实例中的数据不可用了。

还有一个没用过的记录一下

actived

deactivated

errirCaptured

vue3生命周期

beforeCreate 跟 created ---> setup

setup()this是不指向当前实例的(this 为 undefined)如果想使用 $emit 的功能,需要借助 setup(props,context)中的 context;

mounted ---> onMounted

beforeUpdate ---> onBeforeUpdate

updated ---> onUpdated

beforeDestroy ---> onBeforeUnmount

destroyed ---> onUnmounted

actived ---> onActivated

deactivated ---> onDeactivated

errorCaptured ---> onErrorCaptured ,onRenderTracked,onRender,Triggered

v-if v-for

vue 在 2.x 版本中的一个元素同时使用 v-fi 和 v-for 时,v-for 会优先使用。

v-if v-for

vue 在 3.x 版本中 v-if 总是优先与 v-for 生效。避免在同一元素上同时使用两者。

v-bind

vue 在2.x 版本中如果 dom 属性 跟 bind绑定属性一样 ,dom 属性总是会覆盖 bing 绑定的属性;

vue 在3.x 绑定的声明顺序决定 dom 属性绑定的值。

ref

我们知道在 dom 上添加 ref 属性 可以通过 this.$refs.xxx 获取到 dom 元素。或者在 组件上添加 可以获取到 组件的实例;

inheritAttrs

当我们使用组件时,为其传递的 props 进行定义,才能够使用,如果没有定义,这个属性会作为 dom 的属性被渲染。解决是 在组件内 inheritAttrs: false

$attrs

项目中有多层组件传参可以使用 $attrs 配合 inheritAttrs 控制这些特性是否显示在 dom 元素上。

$listeners

vue3 已经不支持 $listeners 在 vue3 合并到了 $attrs

计算属性

vue 用声明的方式创建这种依赖关系,计算属性的 getter 函数是没有副作用的,就是只有依赖的状态发生改变依赖的方法绑定也会更新。计算属性是基于响应式依赖进行缓存的,只会在相关响应式依赖发生改变时它们才会重新求值。依赖没有发生改变计算属性会返回之前的结果。

计算属性默认只有 getter,不过在需要时你也可以提供一个 setter

监听属性

watch 响应数据的变化,当需要在数据变化时执行异步或开销较大的操作时,这个方式是最有用的。

单向数据流

所有的 prop 都使得其父子 prop 之间形成了一个单向下行绑定;父级 prop 的更新会向下流动到子组件中,但是反过来则不行。这样会防止从子组件意外变更父级组件的状态,从而导致你的应用的数据流向难以理解。

prop 规范 prop用来传递一个初始值的话,最好本地 data 定义一个数据用这个 prop 作为其初始值2

prop 规范 prop 值需要转换。 最好使用 计算属性处理这个prop

prop验证

app.component('my-component', {
  props: {
    // 基础的类型检查 (`null` 和 `undefined` 值会通过任何类型验证)
    propA: Number,
    // 多个可能的类型
    propB: [String, Number],
    // 必填的字符串
    propC: {
      type: String,
      required: true
    },
    // 带有默认值的数字
    propD: {
      type: Number,
      default: 100
    },
    // 带有默认值的对象
    propE: {
      type: Object,
      // 对象或数组的默认值必须从一个工厂函数返回
      default() {
        return { message: 'hello' }
      }
    },
    // 自定义验证函数
    propF: {
      validator(value) {
        // 这个值必须与下列字符串中的其中一个相匹配
        return ['success', 'warning', 'danger'].includes(value)
      }
    },
    // 具有默认值的函数
    propG: {
      type: Function,
      // 与对象或数组的默认值不同,这不是一个工厂函数——这是一个用作默认值的函数
      default() {
        return 'Default function'
      }
    }
  }
})

:eagle: 提示

注意 prop 会在一个组件实例创建之前进行验证,所以实例的 property (如 data、computed 等) 在 default 或 validator 函数中是不可用的。

emits

emits:列表声明从父组件继承来的事件

$emit:抛出事件,通过父组件处理

在子组件中,通过 $emit() 来触发事件

在父组件中,通过 v-on 来监听子组件事件

Provide / Inject (的绑定不是响应式)

深度嵌套的组件,而深层的子组件只需要父组件的部分内容。这种情况下,我们可以使用 Provide Inject:父组件使用 provide 提供数据 ,子组件 inject 使用这些数据。

值得注意的 provide 要提供组件实例属性的话,我们需要将 provide转换为返回对象的函数;

异步组件

defineAsyncComponent

组合式 API

新的 setup 选项在组件被创建之前执行,一旦 props 被解析完成,它就将被作为组合式 API 的入口。

在 setup 中你应该避免使用 this,因为它不会找到组件实例。setup 的调用发生在 data property、computed property 或 methods 被解析之前,所以它们无法在 setup 中被获取。

总结

组合式 API光看文档是不行的,还得练,vue 3更新了很多特性,感觉有点像 react ref什么的。

面试被问到 cookie和session

我貌似还没做到过跟 cookie 和 session 相关的。这是记录一下,也是学习!Sim.jpg

cookie (整个web开发的技术)

cookie 客户端电脑中用于保存会话状态的资源是保存在客户端电脑里面的。(网络会话状态跟踪的技术)

会话是一组请求与响应构成,围绕着一件事做请求与响应。

HTTP 协议是一种无状态协议,这次请求与响应下一次是获取不到的,没办法实现状态的跟踪。所以产生了 cookie

cookie 是由服务器生成,保存在客户端的一种信息载体。这个载体存放用户访问站点该站点的会话状态信息。

服务器生成 cookie 放在响应头,响应的形式发送到客户端。客户端接受到响应后,将 cookie 保存到客户端。当客户端再次发送同类请求后,在请求中会携带保存在客户端的 cookie 数据,发生到服务端,由服务器对会话进行跟踪。

cookie 是由若干键值对构成,这里的键一般称为 name,值称为 value。键和值都是 字符串

cookie 登录的应用(Node.js)

哔哩哔哩 av: BV1hw411d7Vg

session (整个web开发的技术)

session 即会话,是 web 开发中的一种会话状态跟踪技术。cookie 是将会话状态存在 客户端硬盘里。而 session 是存放在服务端

在服务端会话技术,在一次会话的多次请求间共享数据,将数据保存在服务端的对象中

为什么使用cookie和session

我们都知道 http 协议是无状态的,服务器无法识别两条 http 请求是否是同一个用户发送的。如果想记录多次请求是否是同一个用户发送的。我们通常使用 cookie 和 session 来确定会话双方的身份。

第一次访问创建 session 对象,给 session对象分配一个唯一的ID

把SESSIONID 作为 cookie 的值发送给浏览器保存

第二次访问的时候,浏览器带着 SESSIONID 的 cookie 访问服务器

服务器校验验证

">