有些 HTML 元素，诸如 <ul>、<ol>、<table> 和 <select>，对于哪些元素可以出现在其内部是有严格限制的。而有些元素，诸如 <li>、<tr> 和 <option>，只能出现在其它某些特定的元素内部。 这会导致我们使用这些有约束条件的元素时遇到一些问题。例如：

  ```html
  <table>
    <blog-post-row></blog-post-row>
  </table>

  ```
  这个自定义组件 <blog-post-row>

  会被作为无效的内容提升到外部，并导致最终渲染结果出错。幸好这个特殊的 is attribute 给了我们一个变通的办法：
```html
  
  <table>
    <tr is="blog-post-row"></tr>
  </table>
```

VUE 解析DOM 模板时的注意事项!

最近收到一条需求，用户在内网登录的时候展示一个功能，用户在外网的情况下是禁止使用这种功能！使用vpn的情况 也算内网，有没有有经验的朋友！

前端如何判断用户使用网络是内网还是外网？

1.使用依赖于 [husky](https://www.npmjs.com/package/husky) 在 git hooks 中 执行任务

2.安装 husky；

3.在package.json 下面加入 husky 的配置项

pre-commit：在 commit 之前 使用 eslint、stylelint 校验 JavaScript、CSS，校验通过才可提交

在进行 git commit 的时候 先去执行 pre-commit 里面的命令 ： 我们在这里输出 husky 并且执行 npm run lint  (我们之前加上的验证eslint的命令)

如果eslint验证通过了，则会进行commit 操作，否则会报eslint的错误提示

当然husky不止是能验证 commit ，也可以进行 push 等操作验证，具体可以参照 npm husky

git 提交代码前校验代码格式规范

uniapp开发的APP，怎么保持用户的登录状态？是通过访问令牌（access token）和刷新令牌(refresh_token )方式吗？

不能保存用户密码的情况

uniapp开发的APP，怎么保持用户的登录状态

有没有人工智能框架推荐一下，最近有个需求需要前端这边智能化处理数据(简单处理),分析等工作；

javascript 人工智能框架 有没有推荐一下

这个问题很多新手朋友们都遇到，我想得其实很简单，公司要用那个学那个，在学会一个的基础上，可以去了解另外一个，前端的路很长！但是远方很美

前端先学习react还是vue

1、Vue生命周期的created()钩子函数进行的DOM操作一定要放在Vue.nextTick()的回调函数中，原因是在created()钩子函数执行的时候DOM 其实并未进行任何渲染，而此时进行DOM操作无异于徒劳，所以此处一定要将DOM操作的js代码放进Vue.nextTick()的回调函数中。与之对应的就是mounted钩子函数，因为该钩子函数执行时所有的DOM挂载已完成。

 2、当项目中你想在改变DOM元素的数据后基于新的dom做点什么，对新DOM一系列的js操作都需要放进Vue.nextTick()的回调函数中；通俗的理解是：更改数据后当你想立即使用js操作新的视图的时候需要使用它。

 3、在使用某个第三方插件时 ，希望在vue生成的某些dom动态发生变化时重新应用该插件，也会用到该方法，这时候就需要在 $nextTick 的回调函数中执行重新应用插件的方法。

什么时候需要用的Vue.nextTick

1. Promise 基本结构

我们知道实例化Promise对象时传入一个函数作为执行器，有两个参数（resolve和reject）分别将结果变为成功态和失败态。

据此我们可以写出基本结构：
```javascript
  function Promise(excutor){
            let self = this;
            self.status = 'pending';    // 状态 等待 => 成功或失败
            self.value = null;          // 成功结果
            self.reason = null;         // 失败原因
 
            function resolve(value){
            
            };
 
            function reject(reason){
            
            };
   }
```
2. then方法

每一个Promise实例都有一个then方法，它用来处理异步返回的结果，它是定义在原型上的方法。
```javascript
// 一个成功 一个失败
Promise.prototype.then = function(onFulfilled, onRejected){
    
}
```
当我们自己实例化一个Promise时，其执行器函数（executor）会立即执行，这是一定的：
```javascript
 let demo = new Promise((resolve, reject)=>{ 
                console.log("在座的各位彭于晏，大家好");
            })
 ```
因此，当实例化Promise时，构造函数中就要马上调用传入的excutor函数执行，为了防止出错，加入try，catch：
```javascript
// 此段代码放在Promise方法里
try {
        excutor(resolve, reject);
    } catch(err) {
        reject(err)
    }
```
3. 状态管理

已经是成功态或是失败态不可再更新状态，Promise 规范中规定：当Promise对象已经由pending状态改变为了成功态（resolved）或是失败态（rejected）就不能再次更改状态。

因此我们在更新状态时要判断，如果当前状态是pending（等待态）才可更新。
```javascript
function resolve(value){
         if (self.status === 'pending') {
                 self.value = value; //保存成功结果
                 self.status = 'fulfilled';
          }
 }
 
 function reject(reason){
          if (self.status === 'pending') {
                  self.reason = reason;
                  self.status = 'rejected';
           }
}
```
  以上可以看到：

  1. 在resolve和reject函数中分别加入了判断

  2. 只有当前状态是pending才可进行操作

  3. 将成功的结果和失败的原因都保存到对应的属性上。之后将state属性置为更新后的状态

4. then方法完善

当Promise的状态发生了改变，不论是成功或是失败都会调用then方法。所以，then方法的实现也很简单，根据state状态来调用不同的回调函数即可。
```javascript
 Promise.prototype.then = function(onFulfilled, onRejected){
            onFulfilled = typeof onFulfilled === 'function' ? 
            onFulfilled : function (data) { resolve(data) }
            onRejected = typeof onRejected === 'function' ? 
            onRejected : function (err) { throw err }
 }
```
代码写到这里似乎基本功能都实现了，可是还有一个很大的问题：目前此Promise还不支持异步代码，如果Promise中封装的是异步操作，then方法无能为力，例：
```javascript
 let demo = new Promise((resolve, reject)=>{ 
                console.log("在座的各位彭于晏大家好");
            
                setTimeout(()=>{
                    resolve(1);
                }, 500)
            })
        // 没有打印
        demo.then(data => console.log(data)); 
```
第一步是正常打印的，但是 setTimeout 里面的代码不会执行，最后一行也不会打印 “1”。

问题所在：原因是 setTimeout 函数使得 resolve 是异步执行的，有延迟，当调用then方法的时候，此时此刻的状态还是等待态（pending），因此then方法即没有调用 onFulfilled 也没有调用 onRejected。

5. 发布订阅模式登场

这个问题如何解决？我们可以参照发布订阅模式，在执行 then 方法时如果还在等待态（pending），就把回调函数临时寄存到一个数组里，当状态发生改变时依次从数组中取出执行就好，是不是很Nice！

清楚这个思路我们开始实现它，首先在类上新增两个Array类型的数组，用于存放回调函数：
```javascript
function Promise(excutor){
    // 其它代码略
     self.onFulfilledCallbacks = [];
     self.onRejectedCallbacks = [];
}
```
在then方法里添加进去：
```javascript
Promise.prototype.then = function(onFulfilled, onRejected){
           // 其它代码略
            let self = this;
 
            
            if(self.status === "pending"){
                 self.onFulfilledCallbacks.push(onFulfilled);
                 self.onRejectedCallbacks.push(onRejected);
            }
}
```
在resolve() 与reject() 里逐一遍历：
```javascript
function resolve(value){
    if (self.status === 'pending') {
        // 其它代码略
        self.onFulfilledCallbacks.forEach(item => item(value));
    }
}
 
 
function reject(reason){
    if (self.status === 'pending') {
        // 其它代码略
        self.onRejectedCallbacks.forEach(item => item(reason));
    }
}
```
到这一步，异步也搞定了！再是如何实现链式调用。 

6. 经典的链式调用实现

then方法接收的两个函数中，可以通过return把值传给下一个步，也可以返回一个新的Promise把值传给下一步，then方法执行的时候有个特点：

为了保证链式调用，上一次then中不管你是成功还是失败都会把参数作为下一个then中成功时回调的参数

话不多说，开干(只需要再new一个Promise即可)：
```javascript
 Promise.prototype.then = function(onFulfilled, onRejected){
             onFulfilled = typeof onFulfilled === 'function' ? 
             onFulfilled : function (data) { resolve(data) }
             onRejected = typeof onRejected === 'function' ? 
             onRejected : function (err) { throw err }
             let self = this;
            if(self.status === "fulfilled"){
                return new Promise((resolve, reject) => {
                    try{
                        let x = onFulfilled(self.value);
                        x instanceof Promise ? x.then(resolve, reject) : resolve(x);
                    } catch (err){
                        reject(err)
                    }
 
                })
            }
 
            if(self.status === "rejected"){
                return new Promise((resolve, reject) => {
                    try{
                        let x = onRejected(self.reason);
                        x instanceof Promise ? x.then(resolve, reject) : resolve(x);
                    } catch (err){
                        reject(err)
                    }
                })
            }
 
            if(self.status === "pending"){
                return new Promise((resolve, reject) => {
                    self.onFulfilledCallbacks.push(()=>{
                        let x = onFulfilled(self.value);
                        x instanceof Promise ? x.then(resolve, reject) : resolve(x);
                    })
                    self.onRejectedCallbacks.push(()=>{
                        let x = onRejected(self.reason);
                        x instanceof Promise ? x.then(resolve, reject) : resolve(x);
                    })
                })
            }
        }
 }
 ```
7. 最后的catch方法

其实catch方法就是then方法的简写
```javascript
Promise.prototype.catch = function(fn){
            return this.then(null, fn);
        }
```
现在，一个完整的Promise就实现了，大家可以去试试。有啥不对的可以在评论区指出，感谢。

考虑到一些新手基础可能差点，本篇文章可以说讲解的非常非常详细了，拆分了多个小步骤，一步一步来。相信大家跟着思路走都是能搞定的。排版啥的也都尽量搞得好看些，提高各位客官的用户体验。

如何手写一个Promise

filters过滤器已从Vue 3.0中删除，不再支持。

2.x 语法
在2.x中，开发人员可以使用过滤器来处理常见的文本格式。
```javascript
<template>
  <h1>Bank Account Balance</h1>
  <p>{{ accountBalance | currencyUSD }}</p>
</template>

<script>
  export default {
    props: {
      accountBalance: {
        type: Number,
        required: true
      }
    },
    filters: {
      currencyUSD(value) {
        return '$' + value
      }
    }
  }
</script>
```
虽然这看起来很方便，但它需要一个自定义语法，打破大括号内表达式“只是JavaScript”的原则，这既增加了学习成本，也增加实现逻辑的成本。

3.x 更新
在3.x中，过滤器被删除，不再受支持。相反，我们建议用方法调用或计算属性替换它们。

下面的例子是一个实现类似功能的。
```javascript
<template>
  <h1>Bank Account Balance</h1>
  <p>{{ accountInUSD }}</p>
</template>

<script>
  export default {
    props: {
      accountBalance: {
        type: Number,
        required: true
      }
    },
    computed: {
      accountInUSD() {
        return '$' + this.accountBalance
      }
    }
  }
</script>
```
官方建议用计算属性或方法代替过滤器，而不是使用过滤器

Vue3 不再支持Filters过滤器，怎么办

最近在学习react的时候发现直接引入less有些时候组件样式会相互影响，造成覆盖！
react中有没有像vye那样设置scoped就能限制局部作用，搜索了好多，只发现了style-conponent(语法提示不够友好)跟 xx.module.less(每个css都要读取引入太麻烦了)，有没有其他简便又能限制局部的插件呢？

react中如何实现局部css样式

一面(40-50 分钟，通过)

介绍一下自己

学过哪些编程语言(我回答了 Java)

Java 的 class 和 JavaScript 的 class 有什么区别(老实话我也不知道有什么区别)

一个树形结构，如何输入一个 id 找到他所在的 children

接上一个问题，怎么判断一个 children 是否跟 parent 存在循环引用

(当我磕磕绊绊回答出来的时候，我给自己挖坑，算了一个时间复杂度，我还不太会的那种)

问了一下 HTTPS 抓包能看到什么，HTTPS 能看到 ip 地址吗?

问了一下 项目

promise 能否用 try catch，来 catch 到 promise 内部的错误

场景题:如何在局域网，自己的电脑上，看到测试同事 H5 页面上的控制台的输出

你有什么想问?

总体感觉良好，问题磕磕绊绊都能回答出来。没有任何背书题目，除了自己给自己挖坑外，都还好。

二面(一个小时左右，通过)

介绍下自己

介绍下项目

针对项目问了一些问题，flexiable 的原理 ，如何计算一个 骨架屏幕... keep-alive 的数据更新问题...

两数之和(没答出来 真的可惜),map 存差值 寻找差值 然后 就可以降维了...

串行 promise(感觉还可以讲几个方案)

flex:1 (复习了又忘了)

object ，Map 的性能问题。。(好像猜的有点准)

总体感觉有点傻逼... 两数之和都回答不上... 总体来说还是 OK 的

三面(20-30 分钟)

换了一个项目组的负责人来面试(线上视频剪辑工具的... 我都不知道是什么东西)

就问了些简单的 自己 的情况

工作上的难点

你有什么想问的 ...

深圳某中型公司面经

使用分流加载还是会卡顿，在IE10中完全卡死，ie11中卡顿厉害，加载缓慢，滚动页面，加载数据卡顿，有种滚动重加载那样，但是监听器组件是没有重渲染的！

求助vue list在ie中会卡死问题！

在 Vue RFC 中有一个关于样式的提案 SFC style CSS variable injection，这个 RFC 为Vue开发者提供了一种使用组件的响应性数据作为CSS变量的方法。

在Vue 3中，只需一个简单的语法，我们就可以在运行时更新样式。

在本文中，我们将了解如何使用这些SFC样式，它是如何工作的，然后了解一些来自RFC的高级知识。

1.如何使用SFC样式？
2. Vue中的响应式样式
3. Vue SFC 样式变量如何工作
4. 需要知道的一些知识
5.CSS变量在子组件中不可用
6.使用前检查浏览器支持情况

Single File Component : 单文件组件，简称 SFC

如何使用SFC样式？
要使用这个特性，只需要两个步骤：

在组件的script中声明一个响应式变量。
在 css 中使用 v-bind 来使用这个变量。
来个粟子：
```javascript
<template>
<div>
  <div class="text">hello</div>
</div>
</template>

<script>
export default {
    data() {
        return {
            color: 'red',
        }
    }
}
</script>

<style>
.text {
    color: v-bind(color);
}
</style>
```
很简单。

尤大在 Vue的生态进展中提到的＜style＞动态变量注入


# javaScript Array api梳理
**一、Array 类型检测**

 1. Array.isArray
 2. instanceof
 3. Array.prototype.isPrototypeOf
 4. Object.getPrototypeOf
 5. constructor
 6. Object.prototype.toString.apply
 
```javascript
let is_array1 = Array.isArray([]) // true
let is_array2 = ([]) instanceof Array // true
let is_array3 = Array.prototype.isPrototypeOf([]) // true
let is_array4 = Object.getPrototypeOf([]) === Array.prototype // true
let is_array5 = ([]).constructor === Array // true
/**
* 推荐使用下面检测方式
*/
let is_array6 = Object.prototype.toString.apply([]) === '[object Array]' // true
```

**二、数组构造函数有几种？**

 1. Array 构造函数
	
```javascript
let arr_new_array1 = new Array() // []
let arr_new_array2 = new Array('4') // ['4']
let arr_new_array3 = new Array('4.0') // ['4.0']
let arr_new_array4 = new Array('4.1') // [4.1']
let arr_new_array5 = new Array(4) // [empty*4]
let arr_new_array6 = new Array(4.0) // [empty * 4]
let arr_new_array7 = new Array(4, 5) // [4, 5] 参数的length 大于1时 直接将参数依次转化为数组中的一项, 返回的新数组
/**
*  下面是两种方式会报错
*/
try {
  // 这里直接报错 Array 数字类型 不是整数时报错
  var arr_new_array8 = new Array(4.1) // error
  // 这里直接报错 Array 数字类型 不是正整数时报错
  var arr_new_array9 = new Array(-1) // error
} catch (e) {
  console.error(e)
}
```

 2. Array.of 构造方法
	

```javascript
/**
 * Array.of 构造方法
 * 参数依次转化为数组中的一项, 返回的新数组
 */
let arr_new_array_of1 = Array.of() // []
let arr_new_array_of2 = Array.of(1) // [1]
let arr_new_array_of3 = Array.of('1') // ['1']
let arr_new_array_of4 = Array.of(1, 2, 3, 4) // [1,2,3,4]
let arr_new_array_of5 = Array.of('1', 2, '3', 4) // ['1',2,'3',4]
```

 * Array.from 构造方法
 
```javascript
/**
 * Array.from 构造方法
 *   arrayLike 想要转换成数组的伪数组对象或可迭代对象
 *   mapFn { Funtion } 可选  新数组中的每个元素都会执行该回调函数
 *   thisArg 可选 执行回到函数 mapFn 时 this 对象
 */
const ArrayFromObj = {0: 'one', 1: 'two', length: 2}
let arr_new_array_from = Array.from(ArrayFromObj, function (item, index) {
  console.log(this) // {test: 'thisObj'} 如果箭头函数 this 指向 该函数所在的作用域
  return `${item} - ${index}` // 如果不设置返回默认 返回undefined
}, {test: 'thisObj'}) // ['one - 0', 'two - 1']
```
**三、影响改变原数组的方法**
基于 ES6，会改变自身值的方法一共有 9 个，shift、unshift、pop、push、reverse、sort 、splice，以及两个 ES6 新增的方法 fill 和 copyWithin。

```javascript
/**
 * 影响改变原数组的方法
 *  shift       将第1个元素删除，返回删除元素
 *  unshift     向数组开头添加元素，返回数组的长度
 *  pop         删除最后一个元素，返回删除元素
 *  push        向数组末尾添加元素，返回数组的长度
 *  reverse     颠倒数组顺序
 *  sort        对数组排序
 *  splice      删除/增加/替换数组元素，返回被删除元素数组
 *  ES6:
 *    fill        固定值填充一个数组中从起始索引到终止索引内的全部元素, 返回数组本身
 *    copyWithin  浅复制数组的一部分到同一数组中的另一个位置, 返回数组本身
 */
let array = [1, 2, 3, 4, 5]
const array_shift = array.shift()
console.log(array) // [2,3,4,5]
console.log(array_shift) // 1

array = [1, 2, 3, 4, 5]
const array_unshift = array.unshift(1, 2, 3)
console.log(array) // [1, 2, 3, 1, 2, 3, 4, 5]
console.log(array_unshift) // 8

array = [1, 2, 3, 4, 5]
const array_pop = array.pop()
console.log(array) // [1,2,3,4]
console.log(array_pop) // 5

array = [1, 2, 3, 4, 5]
const array_push = array.push(1, 2, 3)
console.log(array) // [1,2,3,4,5,1,2,3]
console.log(array_push) // 8

array = [1, 2, 3, 4, 5]
const array_reverse = array.reverse()
console.log(array) // [5,4,3,2,1]
console.log(array_reverse) // [5,4,3,2,1]

array = [100, 2, 3, 4, 5]
const array_sort1 = array.sort() // 没有回调函数 默认Unicode排序
console.log(array) // [100,2,3,4,5]
console.log(array_sort1) // [100,2,3,4,5]

array = [100, 2, 3, 4, 5]
/**
 * sort((a, b) => ...) 回调函数
 *  return 
 *          小于 0, a 会排列到 b 之前
 *          大于 0, b 会排列到 a 之前
 *          等于 0, a、b 位置不变
 */
const array_sort2 = array.sort((a, b) => a - b) // 升序排列数组
console.log(array) // [2,3,4,5,100]
console.log(array_sort2) // [2,3,4,5,100]

array = [1, 2, 3, 4, 5]
/**
 * splice(start[, deleteCount[, item1[, item2[, ...]]]])
 * 参数:
 *    start 开始位置
 *    deleteCount 删除个数 【可选】 如果没有值 默认为 length - start
 *    item1,item2..... 从 start 位置开始添加这些元素 【可选】 如果没有则不添加 只删除 元素
 */
const array_splice = array.splice(1, 2, 30, 40, 50)
console.log(array) // [1,30,40,50,4,5]
console.log(array_splice) // [2,3]

array = [1, 2, 3, 4, 5]
/**
 * fill(value[, start[, end]])
 * value 填充值 
 * start 开始位置【可选】 默认 0
 * end   结束位置 【可选】 默认 length
 */
const array_fill = array.fill(8, 1, 4)
console.log(array) // [1,8,8,4,5]
console.log(array_fill) // [1,8,8,8,5]

array = [1, 2, 3, 4, 5]
/**
 * copyWithin(target[, start[, end]])
 * target 复制序列到该位置 
 * start 开始复制位置【可选】 默认 0
 * end   结束复制位置 【可选】 默认 length
 */
const array_copyWithin = array.copyWithin(1, 4, 5)
console.log(array) // [1,5,3,4,5]
console.log(array_copyWithin) // [1,5,3,4,5]
```
四、不影响自身的方法
基于 ES10，不会改变自身的方法也有 10 个， join、 concat 、slice、toString、toLocaleString、indexOf、lastIndexOf，ES7新增的 includes ，及ES10新增的 flat、flatMap方法。

```javascript
/**
 * 不影响改原数组的方法
 *  join             元素连接成一个字符串并返回这个字符串
 *  concat           合并两个或多个数组，返回新数组
 *  slice            从数组中选定的元素，返回新数组
 *  toString         以,号拼接数组元素，返回字符串
 *  toLocaleString   返回一个字符串表示数组中的元素
 *  indexOf          查找元素是否存在该数组中，返回该元素在数组的下标，没有返回 -1
 *  lastIndexOf      从后面开始查找元素是否存在该数组中，返回该元素在数组的下标，没有返回 -1
 *  ES7:
 *    includes       判断一个数组是否包含一个指定的元素， 返回 Boolean
 *  ES10:
 *    flat           按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回
 *    flatMap        使用映射函数映射每个元素，然后将结果压缩成一个新数组
 */
let array = [1,2,3,4,5,6]
const array_join = array.join('-') // 指定拼接字符，不指定默认为,
console.log(array.join()) // 1,2,3,4,5,6 
console.log(array_join) // 1-2-3-4-5-6

const array_concat1 = array.concat([7,8], [9, 10]) // [1,2,3,4,5,6,7,8,9,10]
const array_concat2 = array.concat(7, [8], [9, 10]) // [1,2,3,4,5,6,7,8,9,10]
console.log(array_concat1) // [1,2,3,4,5,6,7,8,9,10]
console.log(array_concat2) // [1,2,3,4,5,6,7,8,9,10]
console.log(array) // [1,2,3,4,5,6]

const array_slice1 = array.slice() // 不指定位置选定全部元素
const array_slice2 = array.slice(1) // 从指定位置1开始, 没有指定结束位置 默认为length
const array_slice3 = array.slice(2,5) // 选定下标 2-4(结束位置前一个)的元素
console.log(array_slice1) // [1,2,3,4,5,6]
console.log(array_slice2) // [2,3,4,5,6]
console.log(array_slice3) // [3,4]

const array_toString = array.toString()
console.log(array_toString) // '1,2,3,4,5,6'

const array_toLocaleString = array.toLocaleString('ja-JP', { style: 'currency', currency: 'JPY' }) // 不太清楚这里配置 没有深入
console.log(array_toLocaleString) // '¥1,¥2,¥3,¥4,¥5,¥6'

// 注意: 如果数组中有0 -0 与 +0 是相匹配能查询到返回其所在下标
const array_indexOf1 = array.indexOf('1')
const array_indexOf2 = array.indexOf(3)
const array_indexOf3 = array.indexOf() // 如果数组中有undefined元素 返回其下标
console.log(array_indexOf1) // -1
console.log(array_indexOf2) // 2
console.log(array_indexOf3) // -1
// 注意: 如果数组中有0 -0 与 +0 是相匹配能查询到返回其所在下标
const array_lastIndexOf1 = array.lastIndexOf('1')
const array_lastIndexOf2 = array.lastIndexOf(3)
const array_lastIndexOf3 = array.lastIndexOf() // 如果数组中有undefined元素 返回其下标
console.log(array_lastIndexOf1) // -1
console.log(,array_lastIndexOf2) // 2
console.log(array_lastIndexOf3) // -1
// 注意: 如果数组中有0 -0 与 +0 是相匹配能查询到返回其所在下标
const array_includes1 = array.includes('1')
const array_includes2 = array.includes(1)
const array_includes3 = array.includes() // 如果数组中有undefined元素 返回为true
console.log(array_includes1) // false
console.log(array_includes2) // true
console.log(array_includes3) // false

var flatArray = [1,[2,[3],[4]],5,[[[[[6]]]]],7,[8,[9]]]
const array_flat1 = flatArray.flat() // 不指定解层次默认为1
const array_flat2 = flatArray.flat(2) // 2层
const array_flat3 = flatArray.flat(Infinity) // 无限层次
const array_flat4 = flatArray.flat(0) // 0或者负数都 将 array元素进行浅拷贝
console.log(array_flat1) // [1,2,[3],[4],5,[[[[6]]]],7,8,[9]]
console.log(array_flat2) // [1,2,3,4,5,[[[6]]],7,8,9]
console.log(array_flat3) // [1,2,3,4,5,6,7,8,9]
console.log(array_flat4) // [1,[2,[3],[4]],5,[[[[[6]]]]],7,[8,[9]]]

const array_flatMap1 = flatArray.flatMap(item => item)
console.log(array_flatMap1) // [1,2,[3],[4],5,[[[[6]]]],7,8,[9]]
```
**五、遍历的方法**
	基于 ES6，不会改变自身的遍历方法一共有 12 个，分别为 forEach、every、some、filter、map、reduce、reduceRight，以及 ES6 新增的方法 entries、find、findIndex、keys、values。
	

```javascript
/**
 * 遍历/循环方法
 *  map               创建一个新数组，其结果是该数组中的每个元素是调用一次提供的函数后的返回值
 *  forEach           数组的每个元素执行一次给定的函数
 *  some              测试数组中是不是至少有1个元素通过了被提供的函数测试，返回Boolean 有一个符合就不再执行循环
 *  every             测试一个数组内的所有元素是否都能通过某个指定函数的测试, 返回Boolean 有一个不符合就不再执行循环
 *  filter            循环一个数组，返回符合条件的元素数组  
 *  reduce            数组中的每个元素执行一个由您提供的reducer函数(升序执行)，将其结果汇总为单个返回值。
 *  reduceRight       数组中的每个元素执行一个由您提供的reducer函数(降序执行)，将其结果汇总为单个返回值。
 *  ES6:
 *      keys           返回一个包含数组中每个索引键的Array Iterator对象, 通过Array Iterator对象的next方法获取到值 next 返回对象 {value: ---, done: Boolean} 如果done 为true 则到最后
 *      values         返回一个包含数组中每个索引键的值的Array Iterator对象, 通过Array Iterator对象的next方法获取到值 next 返回对象 {value: ---, done: Boolean} 如果done 为true 则到最后
 *      find           返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined
 *      findIndex      返回数组中满足提供的测试函数的第一个元素的索引。若没有找到对应元素则返回-1
 *      entries        返回一个新的Array Iterator对象，该对象包含数组中每个索引的键/值对
 */
// forEach方法
var array = [1, 3, 5]
var obj = { name: 'test' }
var forEachReturn = array.forEach(function(value, index, array){ // 如果箭头函数 this 指向 该函数所在的作用域
  console.log(value) // 1 3 5
  console.log(this.name) // test被打印了三次, this指向obj
}, obj)
console.log(array) // [1, 3, 5]
console.log(forEachReturn) // undefined

// every方法
var o = [10, 20, 30, 40]
var bool = o.every(item => item >= 10)
console.log(bool) // true

// some方法
var array = [0, 1, 2, 3, 6]
var isExist = array.some(function(value, index, array){
  return value > 5
})
console.log(isExist) // true 

// map 方法
var array = [1, 2, 3, 3, 6]
array.map(item => item + 1)
console.log(array)  // [2, 3, 4, 4, 7]

// filter 方法
var array = [10, 20, 30, 30, 60]
var array_filter = array.filter(function(value, index, array){
  return value > 20
})
console.log(array_filter) // [30, 30, 60]

/**
* reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])
* 	callback  执行数组中每个值 (如果没有提供 initialValue则第一个值除外)的函数，包含四个参数：
* 		accumulator 累计器累计回调的返回值; 它是上一次调用回调时返回的累积值，或initialValue（见于下方）。
*       currentValue 数组中正在处理的元素。
*       index 【可选】  数组中正在处理的当前元素的索引。 如果提供了initialValue，则起始索引号为0，否则从索引1起始。
*       array 【可选】调用reduce()的数组
*    
*   initialValue 【可选】作为第一次调用 callback函数时的第一个参数的值。 如果没有提供初始值，则将使用数组中的第一个元素。 在没有初始值的空数组上调用 reduce 将报错。
*
*/
var array = [1, 2, 3, 4]
var array_reduce = array.reduce(function(accumulator, currentValue, index, array){
  return accumulator * currentValue
}, 4)
console.log(array_reduce) // 96
// ES6写法更加简洁 这里不设置 initialValue 参数
array.reduce((t, v) => t * v) // 24

// reduceRight方法 (和reduce的区别就是从后往前累计)
var array = [1, 2, 3, 4]
array.reduceRight((t, v) => t * v) // 24

// entries方法
var array = ["one", "two", "three"]
var iterator = array.entries()
console.log(iterator.next().value) // [0, "one"]
console.log(iterator.next().value) // [1, "two"]
console.log(iterator.next().value) // [2, "three"]
console.log(iterator.next().value) // undefined, 迭代器处于数组末尾时, 再迭代就会返回undefined

// find & findIndex方法
var array = [1, 3, 5, 7, 8, 9, 10]
function find_index_fun1(value, index, array){
  return value % 2 == 0     // 返回偶数
}
function find_index_fun2(value, index, array){
  return value > 11    // 返回大于20的数
}
console.log(array.find(find_index_fun1)) // 8
console.log(array.find(find_index_fun2)) // undefined
console.log(array.findIndex(find_index_fun1)) // 4
console.log(array.findIndex(find_index_fun2)) // -1

// keys方法
[...Array(10).keys()]   // [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
[...new Array(10).keys()] // [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

// values方法
var array = ["a", "b"]
var iterator = array.values()
console.log(iterator.next().value) // a
console.log(iterator.next().value) // b
console.log(iterator.next().value) // undefined
```
|标准| 构造函数/方法 |改变自身方法 | 不改变自身方法 | 遍历的方法 |
|--|--|--|--|--|
| ES5及以前 | Array | shift、unshift、pop、push、reverse、sort 、splice |join、 concat 、slice、toString、toLocaleString、indexOf、lastIndexOf|forEach、every、some、filter、map、reduce、reduceRight |
| ES6/7/8/10 | Array.of、Array.from | fill、copyWithin |includes、flat、flatMap| entries、find、findIndex、keys、values|

最后还有两个非标准 api，at与toSource，这里就不介绍了，有兴趣的同学可以到mdn查询； 

javaScript Array api梳理

公司一直使用的都是vue2.x，在vue conf 中看尤大演示 script setup 让我眼前一亮，这种简便语法太吸引了。

## 示例
在不使用script setup,我们代码是：
```javascript
<template>
	<h1 v-text="count"></h1>
	<p v-text="double"></p>
  <button @click="add">count++</button>
</template>

<script>
import { ref, unref, computed } from 'vue'
export default {
  setup() {
    const count = ref(1)
    const double = computed(() => unref(count) * 2)
    function add() {
      count.value++
    }
    return {
      count,
      double,
      add
    }
  }
}
</script>
```

使用了[ script setup ](https://github.com/vuejs/rfcs/blob/script-setup-2/active-rfcs/0000-script-setup.md) 之后，实现一样的功能，代码如下：
```javascript
<template>
	<h1 v-text="count"></h1>
	<p v-text="double"></p>
  <button @click="add">count++</button>
</template>

<script setup>
import { ref, unref, computed } from 'vue'

const count = ref(1)
const double = computed(() => unref(count) * 2)
function add() {
  count.value++
}
</script>
```

## 组件使用
在 script setup 中 所以组件导入即自动注册：

```javascript
<template>
  <Test :msg="msg"/>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import Test from './components/test.vue'
const msg = ref('msg')
</script>
```
省去了组件的注册步骤，也没有显式的导出变量的动作。
## 使用props & emit & useContext
```javascript
<template>
  <button @click="emit('setData', Number.parseInt(Math.random() * 10))">添加数据</button>
</template>

<script setup>
import { defineEmit, defineProps } from 'vue'
// defineProps(['list'])
const props = defineProps({
  list: {
    type: Array,
    default: () => []
  }
})
const emit = defineEmit(['deleteData', 'setData'])
const { slots , attrs } = useContext()
</script>
```
1.props 需要使用到 defineProps 来定义，用法跟之前的props写法类似
2.emit 使用 defineEmit 定义组件可以发出的事件
3.useContext 访问组件的槽和属性
4.defineProps/defineEmit 会根据传递的值做简单的类型推断
## 指令
指令跟组件是一样导入就自动注册。
```javascript
<template>
  <div v-click-outside />
</template>

<script setup>
  import { directive as clickOutside } from 'v-click-outside'
</script>
```

## inheritAttrs
```javascript
<template inherit-attrs="false"></template>
```
默认值true,在这种情况下父作用域的不被认作 props 的特性绑定 (attribute bindings) 将会“回退”且作为普通的 HTML 特性应用在子组件的根元素上
## await
如果使用了 await 那么 需要 与 Suspense 异步组件 搭配使用

```javascript
/* 父组件 */
<Suspense>
   <template #default>
     <AwaitComponent />
   </template>
   <template #fallback>
       loading....
   </template>
</Suspense>
```

```javascript
<template>
  <h1>{{ result }}</h1>
</template>

<script lang="ts">
import { ref } from "vue";
const result = ref("")
function promiseFun () {
	return new Promise((resolve, reject) => {
		setTimeout(() => resolve('22322323'), 3000)
	})
}
result.value = await promiseFun()
</script>
```
感谢观看


vue3 实验属性 script setup ＜script setup＞

React 在今天刚刚在官网发布了有关于 React 18 的计划更新（The Plan for React 18 – React Blog），同时发布了 Alpha 版本的 npm 包：

下载地址：https://reactjs.org/blog/2021/06/08/the-plan-for-react-18.html

最近虽然忙到没时间做视频，不过这么大的事还是值得来聊聊（趁着公司电脑强制要求升 Big Sur 不让不让用的间隙……）。本文并非逐字翻译，一如既往的会带不少个人想法，不代表公司观点（听说这句话其实说了并没什么卵用是吧 Oppo）。

React 18 正式引入了对并发模式/特性的「渐进升级」策略

之前[1]我就提到过 React 18 会把重点放在解决兼容性和如何做迁移的问题上。

自从 Concurrent Mode（并发模式，以下简称 CM）宣布以来，Core Team 成员每天在推上 Github 上「XXX is not CM-safe」吓死个人，使得整个社区都一直在担心未来的 React 是不是会为了上 CM 直接 breaking change，然后不兼容 CM 的代码必须要全部迁移过来才能用 CM（"all-or-nothing" upgrade strategy)。

这次 18 的计划发布终于横扫了大家的担忧 —— 并发的引入将会是 opt-in 得，不用的话就没有 breaking changes，整体采用了渐进升级的策略（gradual adoption strategy）。

博文里基本没讲怎么渐进，只是说「升级到 18 几乎不需要任何改动」。其实大概上有两个地方做到了「渐进」：

React 团队对 "Concurrency opt-in" roots 的兼容性做了很多优化，如果不用 CM 特性的话，大概率能 just works。如博客所说「concurrent rendering will only be enabled for updates triggered by one of the new features.」—— 从此再无 CM，只有 Concurrent Features（并发特性）[2]

对于直接想让应用的某一部分「躺平」的可以用 legacy root。我之前在 VLOG 第四期[3]中就和大家提到过，17 对事件系统的修改的目的之一就是为了让你的 React 应用同时可以跑在不同「版本」上[4]。18 的实际做法[5]是引入了新的 Root API ReactDOM.createRoot 来与旧的 ReactDOM.render API 区分开来，你可以将整个 React 树分形成不同的 roots，用旧 API 的 legacy roots 会跑在「legacy mode 传统模式」上（相当于跑在 17 上），用新 API 的 roots 会跑在 "Concurrency opt-in" roots 下。

 

React 18 的其他新特性

更加激进的「自动 batching」，React 17 只在事件回调中 batch，React 18 则会对任何来源的 setState 做尽可能多的 batching。 如果你跟我一样是用类似 state monad 的 mental model 来思考 state 的话，你可能会以为 React 早就是这个行为了。对于 Hooks 来说你是没有办法拿到中间状态的 state 而 Class 可以拿 this.state。这也是我以前[6]说过的 class 对比 FC 的纯度问题。

新的startTransition 与 useDeferredValue API，本质上都是允许你将 UI 的一部分标记为「较低的更新优先级」。

Suspense SSR。你可能知道也不知道的是，完全用 React 重写的新 Facebook.com 是用 Hermes 做 SSR 来优化首屏渲染得，所以 SSR 的优化就成为了 React 团队的优先级之一啦……但是传统 SSR 的一个问题是，全量渲染话延迟太高了。而 CM + Suspence 就可以做到用 Suspence boundary 将应用分片，然后以此为单位做流式 SSR，是不是有重新发明 BigPipe 的感觉了？

StrictMode 在既 double-render 之后加入了 double-effect

可以看到，随着 CM 的逐渐落地，其「底层能力」的一面终于开始逐渐显著出来，越来越多的上层应用将会发布以及正在开发中（比如 Brian 提到的 Offscreen API 以及 RN Pre-render）等。

React 18 激不激动

怎么学习TS

前些天一直在找便宜的云服务器，偶然间发现一免费的云平台，这里推荐给大家。

就是阿贝云，网站是https://www.abeiyun.com

说一下感受

1、阿贝云虽然是一小众的云平台，重在免费，该有的东西都有，还能免备案这是最舒服的。

2、使用了一天，上了项目，网速不慢。

3、唯一要指出来就是磁盘太小。

分享免费云服务器

拉取了rustbuster的v3.0.3版本文件, 二进制文件无法使用, 执行结果如下:

```bash
[root_cn@archlinux target]$ ./rustbuster-v3.0.3-x86_64-unknown-linux-gnu
./rustbuster-v3.0.3-x86_64-unknown-linux-gnu: error while loading shared libraries: libssl.so.1.1: cannot open shared object file: No such file or directory
```

拉取了main源码, 想自行尝试编译, 然后卡在了openssl, 以下为报错信息:

```rust
The following warnings were emitted during compilation:

warning: openssl-sys@0.9.47: build/expando.c:4:24: error: pasting "RUST_VERSION_OPENSSL_" and "(" does not give a valid preprocessing token
warning: openssl-sys@0.9.47:     4 | #define VERSION2(n, v) RUST_VERSION_##n##_##v
warning: openssl-sys@0.9.47:       |                        ^~~~~~~~~~~~~
warning: openssl-sys@0.9.47: build/expando.c:5:23: note: in expansion of macro ‘VERSION2’
warning: openssl-sys@0.9.47:     5 | #define VERSION(n, v) VERSION2(n, v)
warning: openssl-sys@0.9.47:       |                       ^~~~~~~~
warning: openssl-sys@0.9.47: build/expando.c:10:1: note: in expansion of macro ‘VERSION’
warning: openssl-sys@0.9.47:    10 | VERSION(OPENSSL, OPENSSL_VERSION_NUMBER)
warning: openssl-sys@0.9.47:       | ^~~~~~~

error: failed to run custom build command for `openssl-sys v0.9.47`

Caused by:
  process didn't exit successfully: `/mnt/d/work/file/rust/rustbuster/target/debug/build/openssl-sys-c5a482a9e0e49574/build-script-main` (exit status: 101)
  --- stdout
  cargo:rustc-cfg=const_fn
  cargo:rerun-if-env-changed=X86_64_UNKNOWN_LINUX_GNU_OPENSSL_LIB_DIR
  X86_64_UNKNOWN_LINUX_GNU_OPENSSL_LIB_DIR unset
  cargo:rerun-if-env-changed=OPENSSL_LIB_DIR
  OPENSSL_LIB_DIR unset
  cargo:rerun-if-env-changed=X86_64_UNKNOWN_LINUX_GNU_OPENSSL_INCLUDE_DIR
  X86_64_UNKNOWN_LINUX_GNU_OPENSSL_INCLUDE_DIR unset
  cargo:rerun-if-env-changed=OPENSSL_INCLUDE_DIR
  OPENSSL_INCLUDE_DIR unset
  cargo:rerun-if-env-changed=X86_64_UNKNOWN_LINUX_GNU_OPENSSL_DIR
  X86_64_UNKNOWN_LINUX_GNU_OPENSSL_DIR unset
  cargo:rerun-if-env-changed=OPENSSL_DIR
  OPENSSL_DIR unset
  cargo:rustc-link-lib=ssl
  cargo:rustc-link-lib=crypto
  OPT_LEVEL = Some("0")
  TARGET = Some("x86_64-unknown-linux-gnu")
  HOST = Some("x86_64-unknown-linux-gnu")
  CC_x86_64-unknown-linux-gnu = None
  CC_x86_64_unknown_linux_gnu = None
  HOST_CC = None
  CC = None
  CFLAGS_x86_64-unknown-linux-gnu = None
  CFLAGS_x86_64_unknown_linux_gnu = None
  HOST_CFLAGS = None
  CFLAGS = None
  CRATE_CC_NO_DEFAULTS = None
  DEBUG = Some("true")
  CARGO_CFG_TARGET_FEATURE = Some("fxsr,sse,sse2")
  running: "cc" "-O0" "-ffunction-sections" "-fdata-sections" "-fPIC" "-g" "-fno-omit-frame-pointer" "-m64" "-Wall" "-Wextra" "-E" "build/expando.c"
  cargo:warning=build/expando.c:4:24: error: pasting "RUST_VERSION_OPENSSL_" and "(" does not give a valid preprocessing token
  cargo:warning=    4 | #define VERSION2(n, v) RUST_VERSION_##n##_##v
  cargo:warning=      |                        ^~~~~~~~~~~~~
  cargo:warning=build/expando.c:5:23: note: in expansion of macro ‘VERSION2’
  cargo:warning=    5 | #define VERSION(n, v) VERSION2(n, v)
  cargo:warning=      |                       ^~~~~~~~
  cargo:warning=build/expando.c:10:1: note: in expansion of macro ‘VERSION’
  cargo:warning=   10 | VERSION(OPENSSL, OPENSSL_VERSION_NUMBER)
  cargo:warning=      | ^~~~~~~
  exit status: 1

  --- stderr
  thread 'main' panicked at /home/root_cn/.cargo/registry/src/mirrors.sjtug.sjtu.edu.cn-4f7dbcce21e258a2/openssl-sys-0.9.47/build/main.rs:126:13:

  Header expansion error:
  Error { kind: ToolExecError, message: "Command \"cc\" \"-O0\" \"-ffunction-sections\" \"-fdata-sections\" \"-fPIC\" \"-g\" \"-fno-omit-frame-pointer\" \"-m64\" \"-Wall\" \"-Wextra\" \"-E\" \"build/expando.c\" with args \"cc\" did not execute successfully (status code exit status: 1)." }

  Failed to find OpenSSL development headers.

  You can try fixing this setting the `OPENSSL_DIR` environment variable
  pointing to your OpenSSL installation or installing OpenSSL headers package
  specific to your distribution:

      # On Ubuntu
      sudo apt-get install libssl-dev
      # On Arch Linux
      sudo pacman -S openssl
      # On Fedora
      sudo dnf install openssl-devel

  See rust-openssl README for more information:

      https://github.com/sfackler/rust-openssl#linux

  note: run with `RUST_BACKTRACE=1` environment variable to display a backtrace
warning: build failed, waiting for other jobs to finish...
```

经过检查openssl与rust均为最新版本, 

```bash
[root_cn@archlinux target]$ sudo pacman -S rust
[sudo] password for root_cn:
warning: rust-1:1.77.2-1 is up to date -- reinstalling
resolving dependencies...
looking for conflicting packages...

Package (1)  Old Version  New Version  Net Change

extra/rust   1:1.77.2-1   1:1.77.2-1     0.00 MiB

Total Installed Size:  249.41 MiB
Net Upgrade Size:        0.00 MiB

:: Proceed with installation? [Y/n] n
[root_cn@archlinux target]$ sudo pacman -S openssl
warning: openssl-3.2.1-1 is up to date -- reinstalling
resolving dependencies...
looking for conflicting packages...

Package (1)   Old Version  New Version  Net Change

core/openssl  3.2.1-1      3.2.1-1        0.00 MiB

Total Installed Size:  11.45 MiB
Net Upgrade Size:       0.00 MiB

:: Proceed with installation? [Y/n] n
```

在网上找了一下, 查到资料, 在[rust-openssl的issues](https://github.com/sfackler/rust-openssl/issues/1227)中提到类似报错, 得到解释如下:

> If you are cross compiling to MUSL, you either need to point openssl-sys to the location that you have a copy of OpenSSL cross compiled to MUSL, or tell it to build a copy of OpenSSL itself with the vendored feature.
>
>	如果你是交叉编译到MUSL，你需要将openssl-sys指向你有一个交叉编译到MUSL的OpenSSL副本的位置，或者告诉它用vendored特性构建一个OpenSSL本身的副本。

由于不会rust, 依靠关键词"交叉编译"+"cargo"搜索到了[cargo交叉编译rust程序](https://blog.csdn.net/tyc880616/article/details/104371502), 顺着找到文件:

```
[root_cn@archlinux .cargo]$ cat ~/.cargo/config
[source.crates-io]
replace-with = 'sjtu' # 指定使用下面哪个源，修改为source.后面的内容即可

# 中国科学技术大学
[source.ustc]
registry = "https://mirrors.ustc.edu.cn/crates.io-index"

# 上海交通大学
[source.sjtu]
registry = "https://mirrors.sjtug.sjtu.edu.cn/git/crates.io-index/"

# 清华大学
[source.tuna]
registry = "https://mirrors.tuna.tsinghua.edu.cn/git/crates.io-index.git"

# rustcc社区
[source.rustcc]
registry = "https://code.aliyun.com/rustcc/crates.io-index.git"
```

没有找到交叉编译的设置, 由于本人不会rust, 线索断了, 尝试向大家寻求一波帮助, 非常感谢阅读.



急切寻求rust编译问题帮助(archlinux, openssl)

永久免费，无需注册

[https://good.xjai.top](https://good.xjai.top)

分享免费GPT4站点

[MoienTajik/AspNetCore-Developer-Roadmap (github.com)](https://github.com/MoienTajik/AspNetCore-Developer-Roadmap/blob/master/ReadMe.zh-Hant.md)

![](https://github.com/MoienTajik/AspNetCore-Developer-Roadmap/raw/master/aspnetcore-developer-roadmap.zh-Hant.png)



【轉貼】ASP.NET Core Developer Roadmap in 2024

南京大学数字金融 - 新华报业集团联合诚邀全职博士后！

【研究方向涵盖】

数智传播、数智金融经济、数据金融经济、数智政务、数智监管治理，以及“大数据、大模型、大计算”全新范式等方向理论与实践

 【具体研究领域】

包括 Bigdata4SocialScience、AI4SocialScience、LLM4SocialScience、Blockchain4SocialScience，以及先进信息技术融合创新在数智金融经济、数智传播社会、数智健康医疗、数智政务治理中的应用。

【薪资待遇优渥】

年薪可达 30 万人民币左右，另有绩效奖金及江苏省和南京市人才补贴。具体薪资需与HR面议，总收入依据专业背景和技能经验而定（计算机 AI 背景者薪资更优）。

【欢迎学科交叉、专业背景不限】

不限制专业背景，致力于构建一个多元、开放、包容的科研环境，因此，欢迎计算机、软件、大数据、人工智能、区块链、隐私计算、数据安全、数据科学等背景的博士人才，也热切邀请具有人文社科背景的博士加入我们的团队，共同探索信息技术与社会科学的交叉前沿。也欢迎其他编程能力强的理工科博士毕业生（即使没有AI等背景也欢迎）。

【南京大学研究中心】

南京大学研究中心为双院士领军的校级科研和创新平台，详情请见：fintech.nju.edu.cn。

【团队氛围】

学科交叉、理论与实践相结合、国际化视野、行业前沿视角和项目。

【联系我们】

请感兴趣的朋友将个人简历发送至邮箱:blockchainfintech@126.com。

【更多招募】 南京大学研究中心招收硕士生、博士生、博士后、青年教师、研究员，也欢迎访问、客座、联培以及科研助理（有些岗位可兼职或远程合作）等

欢迎加入我们，您将在这个富有挑战性和机遇的环境中，开启广阔的职业发展道路，实现个人价值与学术梦想的双赢！

期待您的加入，携手共创数智未来！

南京大学研究中心诚募博士后



![](https://image.hackertalk.net/images/62537abc-405f-44da-a67e-9f18082f3d74)















sqlmap -u "xxxxx.com/#/login" --all  --delay 1 --batch --random-agent

[CRITICAL]can't establish SSL connection.

![](https://image.hackertalk.net/images/4a856cac-750c-4972-aa1f-4bf02f000394)

sqlmap -r win.txt --dbs

**

[CRITICAL] anti-CSRF token 'XSRF-TOKEN' can't be found 


**


