Elnino
获得徽章 0
赞了这篇文章
赞了这篇文章
赞了这篇文章
赞了这篇文章
赞了这篇文章
赞了这篇文章
赞了这篇文章
赞了这篇文章
赞了这篇沸点
「每天一点点🕐」【优先级与求值顺序无关】
🌰例子：true || true && fn() 这个表达式的值是多少，函数fn 会被执行吗?
❓看到上述表达式，第一反应是 “逻辑或||” 是短路操作符，因此答案是true，且 函数fn 不会被执行；如果混合了奇怪的概念，比方说 “逻辑与&&” 优先级高于 “逻辑或||”，应该先执行 true && fn()，所以会执行 函数fn，那么事情就变得奇怪了。
📚“逻辑与&&”、“逻辑或||” 都是短路操作符，“逻辑与&&” 优先级高于 “逻辑或||”，这两个概念都是正确的。
但是优先级高不代表优先运算。优先级是结合的优先级，即谁和谁一组；组了队不代表优先运算，运算顺序还是按照从左到右来的，因此上述表达式等同于 true || ( true && fn() )
关于短路操作符：
“逻辑与&&”、“逻辑或||”都是短路操作符。当“逻辑或||”左边的值是 true 的时候，就会直接返回结果 true，后续代码不会被执行；当“逻辑与&&”左边的值是 false 的时候，就会直接返回结果 false，后续代码不会被执行。
🌰例子：true || true && fn() 这个表达式的值是多少，函数fn 会被执行吗?
❓看到上述表达式，第一反应是 “逻辑或||” 是短路操作符，因此答案是true，且 函数fn 不会被执行；如果混合了奇怪的概念，比方说 “逻辑与&&” 优先级高于 “逻辑或||”，应该先执行 true && fn()，所以会执行 函数fn，那么事情就变得奇怪了。
📚“逻辑与&&”、“逻辑或||” 都是短路操作符，“逻辑与&&” 优先级高于 “逻辑或||”，这两个概念都是正确的。
但是优先级高不代表优先运算。优先级是结合的优先级，即谁和谁一组；组了队不代表优先运算，运算顺序还是按照从左到右来的，因此上述表达式等同于 true || ( true && fn() )关于短路操作符：
“逻辑与&&”、“逻辑或||”都是短路操作符。当“逻辑或||”左边的值是 true 的时候，就会直接返回结果 true，后续代码不会被执行；当“逻辑与&&”左边的值是 false 的时候，就会直接返回结果 false，后续代码不会被执行。
展开
7
43
赞了这篇文章
赞了这篇沸点
「每天一点点🕐」【HTMLCanvasElement.toBlob() 方法需兼容】
前端通常会利用 Canvas 的图片绘制、裁剪、宽高等比压缩等能力，对图片进行处理，利用 Canvas 的 toDataURL 或 toBlob 方法，进行处理后的输出；且这两种方法可进一步控制图片类型和图片质量。
toDataURL 方法特点：
1、用法：canvas.toDataURL(mimeType, qualityArgument)；
2、返回一个 数据URL（data:[<mediatype>][;base64],<data>）；
3、数据存储大小比原图片大33.3%（通过Base64编码，原来的3个字节编码后将成为4个字节，即字节增加了33.3%）；
4、同步执行；
5、浏览器支持相对较好（见图1）；
toBlob 方法特点：
1、用法：canvas.toBlob(callback, mimeType, qualityArgument)；
2、返回一个 Blob对象（可以得到图片存储大小 size ，图片类型 type 等属性）；
3、异步执行，返回一个回调函数，且 Blob对象 作为唯一参数；
4、需要对浏览器做兼容（见图2、3）。
前端通常会利用 Canvas 的图片绘制、裁剪、宽高等比压缩等能力，对图片进行处理，利用 Canvas 的 toDataURL 或 toBlob 方法，进行处理后的输出；且这两种方法可进一步控制图片类型和图片质量。
toDataURL 方法特点：1、用法：canvas.toDataURL(mimeType, qualityArgument)；
2、返回一个 数据URL（data:[<mediatype>][;base64],<data>）；
3、数据存储大小比原图片大33.3%（通过Base64编码，原来的3个字节编码后将成为4个字节，即字节增加了33.3%）；
4、同步执行；
5、浏览器支持相对较好（见图1）；
toBlob 方法特点：1、用法：canvas.toBlob(callback, mimeType, qualityArgument)；
2、返回一个 Blob对象（可以得到图片存储大小 size ，图片类型 type 等属性）；
3、异步执行，返回一个回调函数，且 Blob对象 作为唯一参数；
4、
需要对浏览器做兼容（见图2、3）。
展开
评论
23
赞了这篇沸点
「每天一点点🕐」【跨域陷阱】
跨域需要后端设置几个响应头，分别是：
Access-Control-Allow-Credentials（请求是否可以使用credentials，前后端配合可以进行Cookie跨域传输；布尔值，默认不允许）；
Access-Control-Allow-Origin（服务器接受请求的域名；可以是字段，也可是*）；
Access-Control-Allow-Methods（服务器支持的跨域请求的方法；可以是字段，也可是*）；
Access-Control-Allow-Headers（需列出正式请求中出现的非简单请求头，Accept、Content-Type等简单请求头不需特地列出；可以是字段，也可是*）。
【陷阱】其中Access-Control-Allow-Headers，如果直接使用*，来接受所有请求头，在Google浏览器不会有任何问题，但是在Safari、UC等浏览器，会报“Request header fileld [请求头名称] is not allowed by Access-Control-Allow-Headers”这种错误，导致跨域失败，所以在后端配置Access-Control-Allow-Headers时，需要枚举全部非简单请求头。
跨域需要后端设置几个响应头，分别是：
Access-Control-Allow-Credentials（请求是否可以使用credentials，前后端配合可以进行Cookie跨域传输；布尔值，默认不允许）；
Access-Control-Allow-Origin（服务器接受请求的域名；可以是字段，也可是*）；
Access-Control-Allow-Methods（服务器支持的跨域请求的方法；可以是字段，也可是*）；
Access-Control-Allow-Headers（需列出正式请求中出现的非简单请求头，Accept、Content-Type等简单请求头不需特地列出；可以是字段，也可是*）。
【陷阱】其中Access-Control-Allow-Headers，如果直接使用*，来接受所有请求头，在Google浏览器不会有任何问题，但是在Safari、UC等浏览器，会报“Request header fileld [请求头名称] is not allowed by Access-Control-Allow-Headers”这种错误，导致跨域失败，所以在后端配置Access-Control-Allow-Headers时，需要枚举全部非简单请求头。
展开
1
22
赞了这篇沸点
赞了这篇沸点
「每天一点点🕐」【关于跨域携带 Cookie 的几个点】
1、服务端需设置：
Access-Control-Allow-Credentials:true，
Allow-Control-Allow-Origin:"服务器接受请求的域名"（此时不可用*通配符，且只能指定单一域名）；
2、客户端需设置：withCredentials:true；
3、Andriod 5.0 以后的 WebView 无法写入跨域 Cookie，
需对于 WebView 调用 setAcceptThirdPartyCookies 方法。
IOS 7.0 之后，需对于 WebView 设置 setCookieAcceptPolicy 配置；
4、跨域 Cookie 依然遵循“同源策略”，只有目标服务器域名设置的 Cookie 才会上传给 目标服务器；客户端使用 document.cookie 也无法读取目标服务器域名下 Cookie（因为服务端和客户端跨域，所以只能读取、传递自己种的 Cookie，无法获取到对方的 Cookie ）。
1、服务端需设置：
Access-Control-Allow-Credentials:true，
Allow-Control-Allow-Origin:"服务器接受请求的域名"（此时不可用*通配符，且只能指定单一域名）；
2、客户端需设置：withCredentials:true；
3、Andriod 5.0 以后的 WebView 无法写入跨域 Cookie，
需对于 WebView 调用 setAcceptThirdPartyCookies 方法。
IOS 7.0 之后，需对于 WebView 设置 setCookieAcceptPolicy 配置；
4、跨域 Cookie 依然遵循“同源策略”，只有目标服务器域名设置的 Cookie 才会上传给 目标服务器；客户端使用 document.cookie 也无法读取目标服务器域名下 Cookie（因为服务端和客户端跨域，所以只能读取、传递自己种的 Cookie，无法获取到对方的 Cookie ）。
展开
2
28
赞了这篇文章
赞了这篇文章
赞了这篇文章