Daily Practice
LzMiracle 前端鼓励师

PS 每日一练

每天做一道题 ,虽然可能感觉不多,但是积少成多 加油 打工人!!

2021/3/31

关于new操作符的描述错误的是()C

A、new的第一步是创建一个空对象,并且把this指向该对象

B、new会返回创建的这个对象

C、new不能够调用函数

D、new可以用来生成一个实例

1
2
3
4
5
function fn() {
console.log(1)
}
fn() // 函数可以这样调用
new fn // 也可以用new 调用

2021/4

2021/4/1

关于post和get的区别描述错误的是() C

A、GET会将数据拼接到url地址中,POST会把数据放到请求头里

B、GET传递的数量要比POST小

C、GET可以跨域,POST不能跨域 // GET 和 POST请求都不能跨域,能不能跨域跟请求方式没关系

D、GET历史参数保留在浏览器历史中,POST参数不会保存在浏览器历史中。

2021/4/2

有关各逻辑运算符错误的结论有()B

A、JS逻辑与运算符&& 会在左右两边的表达式结果都为真的时候才返回右边表达式的值

B、JS逻辑与运算符&&不可能出现不会计算右操作数的情形

C、JS逻辑或运算符|| 可能出现不会计算右操作数的情形

D、JS逻辑与运算符&& 可能出现不会计算右操作数的情形

1
2
3
4
5
console.log(1 && 2) // 2
console.log(0 && 2) // 0
console.log(1 || 2) // 1
// && 运算先计算左边的表达式如果为false的话直接返回表达式的值,如果不为false继续计算右边表达式的值,并返回表达式的结果
// || 运算先计算左边的表达式如果不为false的话直接返回表达式的值,如果为false则计算右边表达式的值并返回结果

2021/4/3

1
2
3
4
5
6
7
8
9
10
// 打印程序输出结果
var settings = {
username: 'alan',
level: 19,
health: 90
}

var data = JSON.stringify(settings,['level', 'health']) // 将JSON对象解析为字符串
console.log(data) // "{"levle": 19, "health": 90}"
// JSON.parse()将字符串解析为JSON对象

2021/4/4

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// 打印输出结果
function Dog(name) {
this.name = name
}
Dog.prototype.bark = function() {
console.log(`Woof I am ${this.name}`)
}
const pet = new Dog('Mara')
pet.bark()

delete Dog.prototype.bark
pet.bark()

// Woof I am Mara
// TypeError pet.bark is not a function

2021/4/5

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function greeting() {
throw 'Hello world!' // 抛出一个异常
}

function sayHi() {
try {
const data = greeting()
console.log('It worked!', data)
} catch (e) {
console.log('Oh no an error', e)
}
}
sayHi()

// Oh no an error Hello world!

2021/4/6

1
2
3
4
5
6
7
8
9
10
11
12
function getInfo(member, year) { // 基本类型 --> 真正的值, 引用类型 --> 指针
member.name = 'Lydia'
year = '1998'
}
const person = {
name: 'Alan'
}
const birthYear = '1997'
getInfo(person, birthYear)
console.log(person, birthYear)

// 'Lydia' '1997'

2021/4/7

1
2
3
4
5
6
7
// 输出打印结果
const newArr = [1, 2, 3].map(n => {
if (typeof n === 'number') return
return n * 2
})

// [undefined, undefined, undefined]

2021/4/8

1
2
3
4
5
6
7
8
9
10
11
12
const firstPromise = new Promise((res, rej) => {
setTimeout(res, 500, 'one')
})

const secondPromise = new Promise((res, rej) => {
setTimeout(res, 100, 'two')
})

Promise.race([firstPromise, secondPromise]).then(res => console.log(res))
// two
// Promise.race 顾名思义就是赛跑的意思,哪个结果先返回回来就是输出哪个
// Promise.all 成功的话返回的是一个数组,失败的话则返回最先失败状态的值

2021/4/9

1
2
3
4
5
6
7
8
9
10
11
// 打印输出结果

function sayHi() {
console.log(name)
console.log(age)
var name = 'Lydia'
let age = 21
}
sayHi()

// undefined ReferenceError

2021/4/10

1
2
3
4
5
6
7
8
9
// 输出打印结果
for(var i = 0; i< 3; i++) {
setTimeout(() => console.log(i), 1)
}
for(let i = 0; i < 3; i++){
setTimeout(() => console.log(i), 1)
}

// 333 012 var 和 let 的作用域不同

2021/4/11

1
2
3
4
5
6
7
8
9
10
11
12
13
// 打印输出结果
const shape = {
radius: 10,
diameter() {
return this.radius * 2
},
perimeter: () => 2 * Math.PI * this.radius
}

console.log(shape.diameter())
console.log(shape.perimeter())

// 20 NaN 第二个函数方法没有返回值

2021/4/12

下面选项哪一个时正确的

A: mouse.bird.size 是无效的

B: mouse[bird.size] 是无效的

C: mouse[bird[‘size’]]是无效的

D: 以上三个选项都是有效的

1
2
3
4
5
6
7
8
9
10
const bird = {
size: 'small'
}

const mouse = {
name: 'Mickey',
small: true
}

// ES6中中括号是求值的效果,所以二三选项都是有效的, 第一个选项输出是报错所以是无效的

2021/4/13

1
2
3
4
5
6
7
async function getData({
  return await Promise.resolve('I made it!')
}
const data = getData()
console.log(data)
// async 返回的是一个Promise对象
// Promise(['pending'])

2021/4/14

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
class Chameleon {
  static colorChange(newColor) {
    this.newColor = newColor
    return this.newColor
  }

  constructor({
    newColor = 'green'
  } = {}) {
    this.newColor = newColor
  }
}

const freddie = new Chameleon({
  newColor: 'purple'
})

freddie.colorChange('orange')
// TypeError: freddie.colorChange is not a function
// 因为static的静态方法不会被继承 ,只能有类直接调用才能使用

2021/4/15

1
2
3
4
5
6
7
8
9
10
11
12
13
function Person(firstName, lastName{
  this.firstName = firstName
  this.lastName = lastName
}

const lydia = new Person('Lydia''Hallie')
const sarah = Person('Sarah''Smith')

console.log(lydia)
console.log(sarah)

// 因为调用的函数没有return 任何值,所以输出是undefined
// Person { firstName: "Lydia", lastName: "Hallie" } undefined

2021/4/16

1
2
3
4
5
6
7
8
9
10
11
12
13
function checkAge(data) {
if (data === { age: 18 }) {
console.log('You are an adult')
} else if ( data == { age: 18 } ) {
console.log('You are still an adult')
} else {
console.log("Hmm.. You don't have an age I guess")
}
}
checkAge({ data: 18 })

// Hmm.. You don't have an age I guess
// 比较时data 跟后面的对象指针不同,内存空间不同 所以不相等

2021/4/17

1
2
3
4
5
function getAge(...args) {
console.log(typeof args)
}
getAge(21)
// object ...解构完是数组,typeof Array 是 object

2021/4/18

1
2
3
4
5
6
7
8
9
10
11
12
13
const obj = {
1: 'a',
2: 'b',
3: 'c'
}
const set = new Set([1, 2, 3, 4, 5])
obj.hasOwnProperty('1')
obj.hasOwnProperty(1)
set.has('1')
set.has(1)
// true true false true
// hasOwnProperty(属性名) 是否包含这个属性
// has 是否包含这个值

2021/4/19

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
const add = () => {
const cache = {}
return num => {
if (num in cache) {
return `From cache! ${cache[num]}`
} else {
const result = num + 10
cache[num] = result
return `Calculated ${result}`
}
}
}

const addFunction = add()
console.log(addFunction(10))
console.log(addFunction(10))
console.log(addFunction(5 * 2))

// Calculated 20
// From cache! 20
// From cache! 20
// 闭包在执行完之后不会被垃圾回收机制回收 所以cache一直保存着

2021/4/20

1
2
3
4
5
const { userName: myName } = { userName'Lydia' }
console.log(userName)

// ReferenceError
// 因为进行了解构赋值 所以userName不是一个变量,myName才是一个变量, 所以报错

2021/4/21

1
2
3
4
5
6
7
8
9
10
11
12
const box = {
x: 10,
y: 20
}

Object.freeze(box)
const shape = box
shape.x = 100
console.log(shape)

// {x: 10, y: 20} freeze是将一个 对象冻结 ,不允许修改
// 如果严格模式下会直接报错

2021/4/22

1
2
3
4
5
6
7
8
function addToList(item, list{
  return list.push(item)
}
const result = addToList('apple', ['banana'])
console.log(result)

// push方法返回的是数组长度
// 2

2021/4/23

1
2
3
4
5
6
7
8
9
String.prototype.giveLydiaPizza = () => {
return 'Just give Lydia Pizza already'
}
const nickName = 'Lydia'

console.log(nickName,giveLydiaPizza())

// Just give Lydia Pizza already
// 字面量的赋值相当于new操作,所以继承了原型上的所有属性和方法

2021/4/24

1
2
3
4
5
6
7
8
9
10
11
console.log(new String('alan') === new String('alan'))
const str = 'alan'
const str1 = str
console.log(str === str1)
const x = new String("I'm not a robot")
const y = x
console.log(x === y)

// false true true
// const s = '' 这样赋值时真正占内存的值
// new String('') 这样是创建了个实例化对象

2021/4/25

1
2
3
4
5
6
7
8
9
// 满足所有承诺后,以下哪个解决方案可以解决
Promise.race()
Promise.any()
Promise.all()
Promise.resolve()

// Promise.race() 谁快执行谁
// Promise.any() 谁快执行谁,但是如果是reject的话就执行那些resolve的
// Promise.all() 等到执行完最后一个才输出,如果有reject的话也是会报错

2021/4/26

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
let map1 = new Map([
  ['A'1],
  ['B'2],
  ['C'3]
])

let map2 = new Map([
  ['A'2],
  ['B'2]
])

const spreadMap = new Map([...map1, ...map2])

console.log(spreadMap);

// Map(3) { 'A' => 2, 'B' => 2, 'C' => 3 }

2021/4/27

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function resolveFast(x{
  return new Promise(resolve => {
    console.log(x)
  })
}

async function asyncTest({
  const x = resolveFast(10)
  console.log(5)
}

asyncTest()

// 10 5
// async 返回的是一个Promise对象,没有做异步做操作都视为同步操作

2021/4/28

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
// 找出数组最小的值
const arr = [5101242]
function minNum(arr{
  // return Math.min(...arr) 扩展运算符
  let min  = arr[0]
  for(let i in arr) {
    if(arr[i] < min) {
      min = arr[i]
    }
  }
  return min
}
// reduce
function minNum(arr) {
const num = arr.reduce((item, curr) => {
if(item > curr) {
return curr
}
return item
})
return num
}

2021/4/29

1
2
3
4
5
6
7
8
9
10
11
const a = { x1 }
const b = { ...a }
const c = {}
Object.assign(c, a)
a.x = 2
console.log(a.x)
console.log(b.x)
console.log(c.x)
// 2 1 1
// Object.assign(obj1, obj2) 将目标对象复制到源对象上,返回目标对象 第一个参数obj1为目标对象,第二个参数往后的obj2 ...都为源对象
// 如果是普通类型就是深拷贝 对象的话就是浅拷贝

2021/4/30

1
2
3
4
5
const add = (num1, num2 = num1) => {
  console.log(num1 + num2)
}
add(10)
// 20

2021/5

2021/5/1

1
2
3
4
const res fetch('https://www.website.com/api/user/1')
.then(res => res.json()) // 是一个异步操作,取出所有内容,并将其转为JSON对象
.then(res => console.log(res))
// 前一个.then中回调方法的结果

2021/5/2

1
2
3
4
5
6
7
8
9
10
11
12
function checkAge(age) {
if(age < 18) {
const message = 'Sorry'
} else {
const message = 'YES'
}
return message
}

checkAge(21)
// ReferenceError: message is not defined
// const 的作用域在if else里面 所以函数体内并没有定义message这个变量

2021/5/3

1
2
3
4
5
6
7
8
9
10
11
12
const person = {
name: 'Lydia',
age: 21,
city: 'america'
}

let city = person.city
city = 'Amsterdam'
console.log(person);

// { name: 'Lydia', age: 21, city: 'america' }
// 基本类型的赋值

2021/5/4

1
2
3
4
5
6
7
8
// 哪个表达式的返回结果为false
!(3 <= 1) // true
(2 < 3) || (3 < 2) // true || false return true
("a " == "a") && ("C" != "d") // false && true return false
(1 <= 2) || (3 >= 1) // true || true return first true

// || 当两个为true时 返回第一个参数,当一个true一个false时,返回true的参数,当两个都为false时 会返回后面的参数
// && 当两个都为true时,返回后面的参数,当一个true一个false时,返回false的参数,当两个都为false时,返回第一个值

2021/5/5

1
2
3
4
5
6
7
8
9
10
11
12
function inArray(val, arr) {
for(var i = 0; i<arr.length; i++) {
if(val === arr[i]) {
return i
}
}
return -1
}

var pos = inArray('5', [1, 8, 5, 9, 6])
console.log(pos);
// -1 字符串5跟数组的值没有一个匹配的 所以返回的都是-1

2021/5/6

1
2
3
4
5
6
7
8
9
10
11
12
function time({
  var i = 10
  i++
  return function ({
    var i = 2
    i++
    return i
  }
}

console.log(time()())
// 3 var 的作用域在函数内

2021/5/7

1
2
3
4
5
6
7
8
9
10
11
12
13
14
const arr = [1, 1, 2, 3, 3]
// es5 去重
function resetArr(arr) {
const newArr = arr.filter((item, index, arr) => {
return arr.indexOf(item) === index
})
return newArr
}
// es6去重
function resetArr(arr) {
// ES6提供了新的数据结构Set。它类似于数组,但是成员的值都是唯一的,没有重复的值
const newArr = [...new Set(arr)]
return newArr
}

2021/5/8

1
2
3
4
5
6
7
8
9
10
11
12
13
14
const getList = ([x, ...y]) => [x, y]
const getUser = user => ({
name: user.name,
age: user.age
})

const list = [1, 2, 3, 4]
const user = {
name: 'Lydia',
age: 21
}

console.log(getList(list)) // ...y返回的是一个数组 [1, [2, 3, 4]]
console.log(getUser(user)) // {name: 'Lydia', age: 21}

2021/5/9

1
2
3
4
5
6
7
const info= {
[Symbol('a')]: 'b'
}

console.log(info);
console.log(Object.keys(info));
// Symbol是不可枚举的 所以Object.keys不能遍历到里面的key

2021/5/10

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
class Person {
constructor() {
this.name = 'Lydia'
}
}

Person = class AnotherPerson {
constructor() {
this.name = 'alan'
}
}

const member = new Person()
console.log(member.name);
// 类是可以重新赋值的

2021/5/11

1
2
3
4
5
6
7
8
9
10
11
function nums(a, b) {
if(a > b)
console.log('a is bigger');
else
console.log('b is bigger');
return
a + b // return
}

console.log(nums(4, 2)); // a is bigger undefined
console.log(nums(1, 2));// b is bigger undefined

2021/5/12

1
2
3
4
5
function getItems(fruitList, ...args, favoriteFruit) {
return [...fruitList, ...args, favoriteFruit]
}

getItems(['banana', 'apple'], 'pear', 'orange') // SyntaxError Rest参数之后不能再有其它参数(即,只能是最后一个参数),否则会报错。

2021/5/13

1
2
3
4
5
// 说出几个经常用到的BOM的对象属性及方法
// bom == window
// location 网址信息
// navigator 浏览器配置信息
// 定时器 setTimeout setInterval

2021/5/14

1
2
3
4
5
6
7
8
9
// 说出Cookie、sessionStorage、localStorage的区别
// 分类
cookie: http的一部分, webStorage的一部分
// 应用场景
cookie: 一次http请求的客户端凭证,本地数据的存储
// 存储数据大小
cookie: 4k 每个浏览器对其大小规定都不同,5M
// 是否有api
cookie没有api, 有api

2021/5/15

1
2
3
4
5
6
7
8
9
10
// 如何实现一个私有变量userName,用getName方法可以访问,不能直接访问

const createFn = () => {
let userName = 'lzh'
return () => userName
}
console.log(userName);

const getName = createFn()
console.log(getName());

2021/5/16

1
2
3
4
5
// 1rem 1em 1vh 1px各自代表的含义
// 1rem => 默认是16px 相对于html{}定于
// 1em 相对于父元素定义
// 1vh 相对于设备的高度设定
// 1px 像素单位

2021/5/17

1
2
3
4
5
6
7
8
9
10
11
// 用递归的方式实现1到100的和值
function sum(num1, num2{
  num1 += num2
  if((num2 + 1) > 100) {
    console.log(num1)
    return num1
  } else {
    sum(num1, (num2+1))
  }
}
sum(12)

2021/5/18

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
// 有一个width: 300px height: 300px的box元素,怎么实现在页面上水平垂直居中
// flex布局实现
body {
display: flex;
align-items: center;
justify-content: center;
}
.box {
width: 300px;
height: 300px;
}

// 绝对定位实现
body {
position: relative;
}
.box {
position: absolute;
top: 50%;
left: 50%;
margin: -150px 0 0 -150px;
width: 300px;
height: 300px;
}

2021/5/19

1
2
3
4
5
6
7
8
// 如何使用setTimeout的形式实现setInterval效果
// 递归调用
const runtime = () => {
setTimeout(() => {
runtime() // 递归调用
}, 2000)
}
runtime()

2021/5/20

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
// JS怎么实现一次加载完一张图片之后在加载第二张

const listArr = ['https://...']

// 递归实现
const loadImg = () => {
if(!listArr.length) return
const img = new Image()
img.src = listArr[0]
img.onload = () => {
setTimeout(() => {
document.body.appendChild(this)
listArr.shift()
loadImg()
},2000)
}
}
loadImg()

2021/5/21

1
2
3
// setTimeout 和 Promise的执行顺序
// setTimeout为宏任务,Primise为微任务
// JS中执行事件的顺序为先执行完微任务,在执行宏任务

2021/5/22

1
2
3
// JSONP跨域的缺点
// 只能在script的src 访问,必须先跟后端约定好
// GET请求, 参数限制 不安全,通过fnGlobal函数接收后端返回的参数

2021/5/23

1
2
3
// 图片懒加载和预加载的区别
// 懒加载: 需要加载时才加载
// 预加载: 提前先全部加载,在应用时缓存加载文件即可

2021/5/24

1
2
3
4
5
6
7
8
let name = 'Lydia'
function getName({
  console.log(name)
  let name = 'Sarah'
}
getName()
// 输出打印结果
// let 和 const定义的变量声明都不会提前

2021/5/25

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
// 哪些方法会改变原数组,哪些不会
// 不会改变原数组
/*
concat()---连接两个或更多的数组,并返回结果。
every()---检测数组元素的每个元素是否都符合条件。
some()---检测数组元素中是否有元素符合指定条件。
filter()---检测数组元素,并返回符合条件所有元素的数组。
indexOf()---搜索数组中的元素,并返回它所在的位置。
join()---把数组的所有元素放入一个字符串。
toString()---把数组转换为字符串,并返回结果。
lastIndexOf()---返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索。
map()---通过指定函数处理数组的每个元素,并返回处理后的数组。
slice()---选取数组的的一部分,并返回一个新数组。
valueOf()---返回数组对象的原始值
*/

// 会改变原数组
/*
pop()---删除数组的最后一个元素并返回删除的元素。
push()---向数组的末尾添加一个或更多元素,并返回新的长度。
shift()---删除并返回数组的第一个元素。
unshift()---向数组的开头添加一个或更多元素,并返回新的长度。
reverse()---反转数组的元素顺序。
sort()---对数组的元素进行排序。
splice()---用于插入、删除或替换数组的元素

2021/5/26

1
2
3
4
5
6
7
8
9
10
11
12
13
const colorConfig = {
  red: true,
  blue: false,
  green: true,
  black: true,
  yellow: false
}

const colors = ['pink''red''blue']

console.log(colorConfig.colors[1]);
// TypeError
// 对象的取值可以用obj.key 或者 obj['key'],后者必须要用 ' ',前者不需要

2021/5/27

1
2
3
4
5
6
7
8
9
10
11
12
function compareMembers(person1, person2 = person) {
if(person1 !== person2) {
console.log("Not the same!")
} else {
console.log("They are the same!")
}
const person = {
name: 'Lydia'
}
compareMembers(person)
// They are the same!
// 这里比较的是值的相不相同,指针是不同的

2021/5/28

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// 下面哪个可以打印hello world
const myMap = new Map()
const myFunc = () => 'greeting'

myMap.set(myFunc, 'Hello world!') // () => 'greeting'

// 1
console.log(myMap.get('greeting'))

// 2
console.log(myMap.get(myFunc))

// 3
console.log(myMap.get(() => 'greeting'))

// 2 其它两个都是undefined, 第三个虽然值一样但是是不同的指针

2021/5/29

1
2
3
4
5
// 箭头函数有哪些注意点和特点
// this指向的问题,指向的是当前创建函数的父极作用域
// 没有arguments对象
// 不可以作为构造函数进行使用,不能使用new操作符进行函数的调用
// 不能使用yield修饰符,不能作为generator函数来进行使用

2021/5/30

1
2
3
4
5
6
7
8
9
// Set 和 Map的区别
// set
// 每一项不能用重复项
// 只有值,没有键名,更像一个数组
// 可以遍历,方法add delete has

// map
// 本质上值键值对的集合,类似对象
// 可以遍历,可以跟各种数据格式化进行转化

2021/5/31

1
2
3
4
5
6
7
8
9
10
11
12
13
const promise = new Promise((resolve, reject) => {
console.log(1);
resolve();
console.log(2);
})

promise.then(() => {
console.log(3)
})
console.log(4)

// 执行顺序
// 1,2,4,3

2021/6

2021/6/1

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
// 实现对象深度克隆

const obj1 = {
a: {
text: 'Hello World'
}
}

const deepClone = (obj) => {
const newObj = Array.isArray(obj)? [] : {}
for(let key in obj) {
const template = typeof obj[key] === 'object' ? deepClone(obj[key]) : obj[key]
newObj[key] = template
}
return newObj
}

const obj2 = deepClone(obj1)
obj2.a.text = '你好 世界'
console.log(obj1) // 深度克隆 修改obj2的值,obj1的值是不会变的

2021/6/2

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// 将ajax的get方法用Promise的方式实现

const PromiseGet = (url) => {
return new Promise((resolve, reject) => {
const xhr = new XMLHttpRequest()
xhr.open('GET', url)
xhr.send()
xhr.onreadystatechange = () => {
if(xhr.readyState === 4 && xhr.state === 200) {
resolve(xhr.responseText)
} else if(xhr.readyState === 4 && xhr.state !== 200) {
reject('error')
}
}
})
}

2021/6/3

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
// 定义一个user对象 实现对象内属性值改变的监听操作
const user = {
name: 'lzh'
}

// vue 2 的数据绑定
Object.defineProperty(user, 'name', {
set(val) {
console.log('new value is' + val)
}
})

// vue 3 的数据绑定
const user1 = new Proxy({}, {
set(target, key, value) {
console.log(target, key, value)
}
})

2021/6/4

1
2
3
4
5
6
7
const name = 'Lydia Haille'

console.log(!typeof name === 'object')
console.log(!typeof name === 'string')

// false false
// 因为typeof name的值是string ,'object'也是一个字符串 所以typeof name === 'object'是为true的 下面的'string'同理

2021/6/5

1
2
3
4
5
6
7
8
9
10
const config = {
languages: [],
set language(lang) {
return this.languages.push(lang) // set 修饰符,对对象的赋值进行监听
}
}

console.log(config.language)

// undefined

2021/6/6

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
const add = x => y => z => {
console.log(x, y, z)
return x + y + z
}

add(4)(5)(6)

// 相当于
const add = function(x) {
return function(y) {
return function(z) {
return x + y + z
}
}
}

// 4 5 6
// 三层作用域的创建

2021/6/7

1
2
3
4
5
6
7
8
9
10
11
12
const obj = {
  1'a',
  2'b',
  3'c',
  name: 'lzh'
}

const set = new Set([12345])
console.log(obj.hasOwnProperty('1')); // true 本质上在对象里面还是'1': 'a'的形式所以还是true
console.log(obj.hasOwnProperty(1)); // true
console.log(set.has('1')); // false
console.log(set.has(1)); // true

2021/6/8

1
2
3
4
5
6
7
console.log(Boolean(0)) // false
console.log(Boolean(new Number(0))) // true
console.log(Boolean((''))) // false
console.log(Boolean((' '))) // true
console.log(Boolean(new Boolean(false))) // true
console.log(Boolean(undefined)) // false
// 除了0, false, '', null, undefined, NaN外,其他都是真值

2021/6/9

1
// 今天的题目重复了 明天在一起更新

2021/6/10

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
/**
 * 矩阵中的幸运数
 * 幸运数:
 *  在同一行的所有元素中最小
    在同一列的所有元素中最大
 */

const matrix = [[3,7,8],[9,11,13],[15,16,17]]

function luckyNumbers(matrix
    let m = matrix.length // 拿到行数
    let n = matrix[0].length // 拿到列数
    let row = []
    let col = []
    let res = []

    for(let i = 0; i<m; i++) {
        min = matrix[i][0]
        for(let j = 0; j<n; j++) {
            if(min > matrix[i][j]) {
                min = matrix[i][j]
            }
        }
        row.push(min)
    }

    for(let i = 0; i<n; i++) {
        max = matrix[0][i]
        for(let j = 0; j<n; j++) {
            if(max < matrix[j][i]) {
                max = matrix[j][i]
            }
        }
        col.push(max)
    }
    for(let i = 0;i<m;i++) {
        if(col.indexOf(row[i]) >= 0) {
            res.push(row[i])
        }
    }
    return res
 }


/**
 * 返回不能吃到午餐的学生数
 * 两个数组只有 0和1 
 * 学生数组0或1代表学生喜欢的午餐类型
 * 午餐类型数组0或1代表午餐的类型
 * 如果学生对应的午餐类型不符合则这个学生就自动到队列的最后
 */

const students = [111001]
const sandwiches = [100011]

function countStudents(students, sandwiches{
  let count = 0
  while (count !== sandwiches.length) {
    if (students[0] == sandwiches[0]){ // 判断学生是否喜欢栈顶的三明治
      students.shift();
      sandwiches.shift();
      count = 0// 计数清零
    } else{
      students.push(students.shift());
      count++;
    }
  }
  return count
}

2021/6/11

1
2
3
4
5
6
7
8
9
10
11
12
13
(async() => {
  try {
    console.log(await new Promise((resolve) => {
      resolve('have some cool data')
    }));
  } catch {
    throw new Error(`Oops didn't work`)
  } finally {
    console.log('Oh finally!');
  }
})()

// have some cool data Oh finally!

2021/6/12

1
2
3
4
5
6
7
8
9
10
const randomValue = 21

function getInfo() {
console.log(typeof randomValue)
const randomValue = 'Lydia Hallie'
}

getInfo()

// ReferenceError const 和 let变量在声明前不能被调用

2021/6/13

1
2
3
4
5
6
7
8
9
10
const name = 'Lydia Hallie'
const age = 21

console.log(Number.isNaN(name)) // 判断的是通过Number转换之后是否为NaN
console.log(Number.isNaN(age))

console.log(isNaN(name)) // 判断是否是数字值,不是的话返回true
console.log(isNaN(age))

// false false true false

2021/6/14

1
2
3
4
5
6
7
8
9
10
const spookyItems = ["👻", "🎃", "❄"]

({
item: spookyItems[3] // 相当于扩展出第四个
} = {
item: "💀" // 对象结构赋值
})
console.log(spookyItems)

// const spookyItems = ["👻", "🎃", "❄", "💀" ]

2021/6/15

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
// 判断能否形成等差数列
// 给定一个数组,如果经过排序每相邻的两个数相差的值都等于一个值则返回true 反之false

const arr = [3, 5, 1]

function canMakeArithmeticProgression(arr) {
arr.sort((a, b) => {
return a - b
})
let flag = arr[1] - arr[0]
for(let i = 1; i<arr.length;i++) {
if(flag !== arr[i] - arr[i - 1]){
return false
}
}
return true
}

2021/6/16

1
2
3
4
5
6
7
8
9
10
/*
* 山峰数组
* 找到符合 arr[0] <... < arr[i-1] < arr[i] 或者 arr[i] > arr[i-1] > ... > arr[0] 的arr[i]的下标
*/
const arr = [0, 2, 1, 0]
function peakIndexInMountainArray(arr) {
let max = Math.max(...arr)
return arr.indexOf(max) // 故名思义就是找到最大值的索引
}

2021/6/17

1
2
3
4
5
6
7
let a = 3
let b = new Number(3) // 定义出来是一个 object
let c = 3

console.log(a == b) // true ==比较的是值相不相同
console.log(a === b) // false === 比较的是值和数据类型相不相同
console.log(b === c) // false

2021/6/18

1
2
// 只出现一次的数  给定一个数组返回只出现过一次的数,其余的数都是出现两次或以上
return arr.reduce((pre,cur) => pre ^ cur) // 异或 相同为0 不同为1

2021/6/19

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
// 实现从0到1024累计的过程
var btn = document.getElementsByClassName('btn')[0]
btn.addEventListener('click', () => add(1024))
var number = document.getElementsByClassName('number')[0]

const add = (endNum) => {
console.log('11')
let initNum = 0
let addNum = 80
let timer = setInterval(() => {
if(initNum >= endNum) {
number.innerHTML = endNum
clearInterval(timer)
return
}
initNum += addNum
number.innerHTML = initNum
}, 100)
}

2021/6/20

1
2
3
4
5
6
7
8
9
10
11
12
13
// 使用link与@import 引入css有什么区别

// link html 标签
// @import css 提供的一种方式

// link 的扩展性好一些 rel= 'stylesheet'
// @import 只能加载css文件

// link加载html界面的时候可以同时加载link引入的css文件
// @import 等到页面全部加载完成后才执行

// link标签加入的css样式可以使用js获取属性,@import的不能用DOM操作

2021/6/21

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
let arr = [1, 2, 3, 3, 4, 4, 4, 'a', 'a', 6, 6, 6]
// 找出有且仅有两个连续相同的列表项结合 输出格式为[{value: 3}, {value: 'a'}]

function double(arr) {
let num = 1
let obj = {}
arr.forEach((item, index, initArr) => {
if(item === initArr[index + 1]) {
num ++
obj[item] = num
} else {
num = 1
}
})
return Object.keys(obj).filter(key => obj[key] === 2).map(item => ({
value: item
}))
// Object.keys(obj)返回一个可枚举的字符串数组
}

2021/6/22

1
2
3
4
5
6
7
8
9
// 手写一个数组的pop方法
Array.prototype.myPop = ()=> { // 不能使用箭头函数,因为箭头函数没有this
let n = null
n = this[this.length - 1]
this.length -= 1
return n
}
const arr = [1, 2, 3, 4]
console.log(arr.myPop())

2021/6/23

1
2
3
4
5
6
7
8
// 手动实现数组的push方法

Array.prototype.myPush = function (item) {
for(let i in arguments) {
this[this.length] = arguments[i]
}
return this.length
}

2021/6/24

1
2
3
4
5
6
7
8
9
10
11
12
13
const a = {foo: 1}
const b = {bar: 2}
const c = {baz: 3}

// 实现一个方法将这三个对象合并为一个对象

const merge = (...arr) => {
return arr.reduce((prev, next) => {
return {...prev, ...next}
})
}
merge(a, b, c)

 评论