我不知道的前端(一)

记录下我的学习笔记

原生JS如何获取父节点?

element.parentNode


sort()函数详细

sort函数蛮常用,但是我的开发日常也仅限于sort(),还是有必要详细陈列
sort可以接受一个函数

sort((a,b)=>{
    return a-b;
})

a\b是什么嘞?我尝试了一下

var array=[-1,1,3,4,6,10]; 
array.sort((a,b)=>{console.log(a,b);return a-b;});
1 -1
3 1
4 3
6 4
10 6

第一个参数,即a,为array[1,array.length-1],第二个到结尾
第二个参数,即b,为array[0,array.length-2],第一个到倒数第二个
a-b的通意即后一项减前一项的值
当函数返回值小于0,则a会出现在b前边
这里举个例子

var array=[-1,1,3,4,6,10]; 
array.sort((a,b)=>Math.abs(a-3)-Math.abs(b-3));

这玩意儿结果是啥?
分析一下

  1. |1-3|-|-1-3|=2-4=-2 ==> [1,-1]
  2. |3-3|-|1-3|=0-2=-2==>[3,1,-1]
  3. |4-3|-|3-3|=1>0==>[3,4,1,-1]
  4. |6-3|-|4-3|=3-1>0==>[3,4,6,1,-1]
  5. |10-3|-|6-3|=7-3=4>0==>[3,4,6,10,1,-1]
    所以结果应为[3,4,6,10,1,-1]

另外注意,sort是排序原本的数组


JavaScript的数据类型

值类型(基本数据类型) :字符串(String)、数字(Number)、布尔(Boolean)、对空(Null)、未定义(Undefined)、Symbol

引用数据类型:对象(Object)、数组(Array)、函数(Function)

注意基本数据类型和引用数据类型的区别

Symbol 是 ES6 引入了一种新的原始数据类型,表示独一无二的值


JavaScript Window History

注意!!!下述所以方法属性有个核心要点在浏览器内

window.history 对象可不带 window 书写。

为了保护用户的隐私,JavaScript 访问此对象存在限制。

一些方法:
  • history.back() - 等同于在浏览器点击后退按钮
  • history.forward() - 等同于在浏览器中点击前进按钮
  • history.go() - go() 方法可加载历史列表中的某个具体的页面。该参数可以是数字,使用的是要访问的 URL 在 History 的 URL 列表中的相对位置。(-1上一个页面,1前进一个页面)。或一个字符串,字符串必须是局部或完整的URL,该函数会去匹配字符串的第一个URL。
一些属性
  • history.length - 返回历史记录列表中的URL数量,包括当前加载的页面

阻止浏览器默认行为

  • window.event.returnValue = false
  • event.preventDefault();

实例:放在提交表单中的onclick事件中则不会提交表单,如果放到超链接中则不执行超链接


原生js设置样式

fe: document.getElementById(‘button1’).style.backgroundColor=“red”;


js中的location对象

Location 对象存储在 Window 对象的 Location 属性中,表示那个窗口中当前显示的文档的 Web 地址

Location 对象属性
属性描述
hash设置或返回从井号 (#) 开始的 URL(锚)。
host设置或返回主机名和当前 URL 的端口号。
hostname设置或返回当前 URL 的主机名。
href设置或返回完整的 URL。
pathname设置或返回当前 URL 的路径部分。
port设置或返回当前 URL 的端口号。
protocol设置或返回当前 URL 的协议。
search设置或返回从问号 (?) 开始的 URL(查询部分)。
Location 对象方法
属性描述
assign()加载新的文档。
reload()重新加载当前文档。
replace()用新的文档替换当前文档。

Promise的done与扩展always(或者说finally)

done

Promise 对象的回调链,不管以then方法或catch方法结尾,要是最后一个方法抛出错误,都有可能无法捕捉到(因为 Promise 内部的错误不会冒泡到全局)。因此,我们可以提供一个done方法,总是处于回调链的尾端,保证抛出任何可能出现的错误。

asyncFunc()
.then(f1)
.catch(r1)
.then(f2)
.done()

done 引用自https://blog.csdn.net/ixygj197875/article/details/79188199

always(finally)

这个非常简单,表示不管 Promise 对象最后状态如何,都会执行的操作


Promise的then

我想你对于

promise
.then(()=>{
    console.log('success');
})

蛮熟悉
谁知道这玩意儿居然有第二个参数!

promise.then(()=>{},()=>{
    console.log('fail');
})

关于this 的工作原理,4种情况

1、当在函数调用的时候指向widow
2、当方法调用的时候指向调用对象
3、当用apply和call上下文调用的时候指向传入的第一个参数
4、构造函数调用指向实例对象
JS中this关键字, 它代表函数运行时,自动生成的一个内部对象,只能在函数内部使用
全局函数调用时,this指向全局函数; 应该是指向调用全局函数的对象。


Math.floor()和Math.ceil()

floor向小取整,ceil向大取整,不四舍五入


call()和apply()

call() 方法使用一个指定的 this 值和单独给出的一个或多个参数来调用一个函数。
apply() 方法使用一个指定的 this 值和参数列表来调用一个函数。


哪些事件支持冒泡,哪些不支持

image.png
本图来自 https://www.nowcoder.com/questionTerminal/3acdd6a7ca7244659c473ee62aec565c?source=relative


null == undefined

尽管null和undefined是不同的,但它们都表示“值的空缺”,两者往往可以互换,因此==运算符认为两者是相等的


来自 https://www.nowcoder.com/questionTerminal/3acdd6a7ca7244659c473ee62aec565c?source=relative


null == undefined

尽管null和undefined是不同的,但它们都表示“值的空缺”,两者往往可以互换,因此==运算符认为两者是相等的


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值