《JavaScript高级程序设计》__ 语言基础(下)

简介: 前言大家好,我是HoMeTown,web领域有一本神书大家应该都有看过,这本书我看过两遍,但是每次看都是粗粗的略过一些重要的知识点,甚至一些面试过程中的问题,在这本书里都能找到答案。

前言

大家好,我是HoMeTown,web领域有一本神书大家应该都有看过,这本书我看过两遍,但是每次看都是粗粗的略过一些重要的知识点,甚至一些面试过程中的问题,在这本书里都能找到答案。

工作这么多年,到现在为止对这本书都没有一个系统的知识点记录,这次想从头读一遍这一本JavaScript高级程序设计【第4版】,并把重要的知识点记录下来,同时加上自己的见解,这也是我第一次在掘金上记录分享读书笔记,共勉之!

关注专栏,一起学习吧~

操作符

一元操作符

概念:只操作一个值。

递增(++)/递减(--)

前缀版

let age = 29
++age
// 以上代码等价于:
let age = 29
age = age + 1
复制代码

与后缀版不同的是:变量的值会在语句被求值之前改变!

let age = 32
let hisAge = ++age + 1
console.log(age) // 33
console.log(hisAge) // 34
复制代码

后缀版

let age = 32
let hisAge = age++ + 1
console.log(age) // 33
console.log(hisAge) // 33
复制代码

一元加(+)和减(-)

let age = +12
let num = -12
console.log(age) // 12
console.log(num) // -12
复制代码

位操作符

位操作符用于数值的底层操作,ECMAScript底层以IEEE 754 64位格式存储,但是操作是将值转化为32位,再转成64位

有符号整数值前31位表示数值第32位表示数值的符号:1正,0负,其中正值以真正的2进制存储:

比如18的2进制:00000000000000000000000000010010,精简版:10010(5个有效位)。
18/2 = 9 余0 //0
9/2 = 4 余 1 //1
4/2=2 余0 //0
2/2=1 余0 //0
1/2=0 余1 //1
得:10010
反过来算:2**0*0 + 2**1*1 + 2**2*0 + 2**3*0 + 2**4*0 = 18
       :0 + 2 + 0 + 0 + 16 = 18
复制代码

而负数需要进行一个补码操作,一个数值的补码通过如下3个步骤:

  1. 决定绝度值的二进制数。
  2. 反码(也就是把每个0变成1,把每个1变成0)
  3. 给结果+1。
比如-18的2进制:11111111111111111111111111101110。
1. 确定18的2进制:00000000000000000000000000010010
2. 反码:11111111111111111111111111101101
3. 结果+1:11111111111111111111111111101110
复制代码

其实ECMAScript会帮我们记录这些值,把一个负数值转成一个2进制字符串时,会得到一个加了减号的绝对值:

let num = -18
num.toString(2) // -10010
复制代码

按位非

~,返回数值的反码:

let num1 = 25 // 二进制 00000000000000000000000000011001
let num2 = ~num1 // 二进制数 11111111111111111111111111100110
console.log(num2) // -26
复制代码

~按位非因为只取到了反码,所以会在结果上-1,如果需要得到对应的负数值,需要再+1.

~num1 + 1 // -25
复制代码

按位与

&,将两个数的每一个位对其,基于与规则(1&1=1;1&0=0;0&1=0;0&0=0),对每一位执行相应的与操作(只要有一位是0,那么就返回0):

let result = 25 & 3
console.log(result) // 1
---
25 // 11001
3 //  00011
1  // 00001
复制代码

按位或

|,与按位与类似,但是你只要一个位是1,那么就返回1:

let result = 25 & 3
console.log(result) // 27
---
25 // 11001
3 //  00011
27  //  11011
2**0*1 + 2**1*1 + 2**2*0 + 2**3*1 + 2**4*1 = 27
  1   +   2   +  0  +   8  +  16 = 27
复制代码

按位异或

^,只有一位是1,返回1,两位都是1或者两位都是0,返回0

let result = 25 & 3
console.log(result) // 27
---
25 // 11001
3 //  00011
26  //  11010
2**0*0 + 2**1*1 + 2**2*0 + 2**3*1 + 2**4*1 = 26
  0 + 2 + 0 + 8 + 16 = 26
复制代码

左移

<<,把2进制数往左移动n位,空位补0:

let oldVal = 2 // 00010
let newVal = oldVal << 5 // 1000000
console.log(newVal) // 2*6*1 64
复制代码

右移

>>,把2进制数往右移动n位,空位补0。

布尔操作符

逻辑与

&&

1 2 r
t t t
t f t
f t f
f f f
复制代码

逻辑与是一种短路操作符,如果第一个操作数决定了结果,第二个就不再求值:

true && name // 报错
false && name // 不报错
复制代码

逻辑或

||

1 2 r
t t t
t f t
f t t
f f f
复制代码

逻辑或也是一种短路操作符,如果第一个操作数是true,第二个就不再求值:

true || obj // 不报错
false || obj // 报错
复制代码

逻辑非

!

console.log(!false); // true 
console.log(!"blue"); // false 
console.log(!0); // true 
console.log(!NaN); // true 
console.log(!""); // true 
console.log(!12345); // false
------
console.log(!!"blue"); // true 
console.log(!!0); // false 
console.log(!!NaN); // false 
console.log(!!""); // false 
console.log(!!12345); // true
复制代码

乘性操作符

乘法

*

除法

/

取余

%

指数操作符

**

2 ** 2 // 4
let num = 2
num **= 3 // 8
复制代码

条件操作符

xx ? yyy : ddd

语句

if

流程控制语句

if (condition) statemert1 else statement2

do-while

后测试循环语句,循环体中的代码至少执行一次

do { statement } while (expression)
复制代码
let i = 0;
do {
  i += 1
} while( i < 10 )
复制代码

while

先测试循环语句,循环体中的代码可能一次都不会执行

while(expression) statement
复制代码
let i = 0;
while(i<10){
  i += 2
}
复制代码

for

先测试循环语句:

for( initialization; expression; post-loop-expression) statement
复制代码
for(let i = 0; i < count; i++) {
  console.log(i)
}
复制代码

执行的顺序为:initialization -- > expression? statement : exit() ;post-loop-expression;expression? statement : exit() ;post-loop-expression;.......

for-in

严格的迭代语句,用于枚举对象中的非符号(Symbol)键属性:

for(const propName in window) {
  console.log(propName)
}
复制代码

ECMAScript中对象的属性是无序的,因此for-in语句不能保证返回对象属性的顺序(每个可枚举的属性都会返回,但是顺序可能会因浏览器而异)。

for-of

严格的迭代语句,用于遍历可迭代对象的元素:

for(const el of [2,4,5,6]) {
  console.log(el)
}
复制代码

break和continue

break语句用于立即退出循环,强制执行循环后的下一条语句,也就是直接退出循环

let num = 0
for (let i = 1; i < 10; i++) {
  if(i%5 === 0) {
    break;
  }
  num++
}
console.log(num) // 4
复制代码

continue语句用于立即退出循环,再次从循环顶部开始执行

let num = 0
for (let i = 1; i < 10; i++) {
  if(i%5 === 0) {
    continue;
  }
  num++
}
console.log(num) // 8
复制代码

switch case

流程控制语句:

switch(expression){
  case value1:
    statement1
    break;
  case value2:
    statement2
    break;
  default:
    statement
}
复制代码

函数

function functionName(arg0, arg1, ...argN) {
  statements
}
// -- -
function sayHi(name, word) {
  console.log(`Hello ${name}!${word}`)
}
sayHi('HoMeTown', 'Welcome!')
复制代码

总结

  • ECMAScript中的基本数据包括:UndefinedNullBooleanNumberStringSymbolBigInt
  • ECMAScript不区分整数与浮点数,都用Number
  • Object是一个复杂数据类型,是ECMAScript中所有对象的基类。
  • ECMAScript中的函数不需要制定函数返回值,默认为undefined


目录
相关文章
|
6月前
|
JavaScript 前端开发 Java
JavaScript语言
JavaScript语言
39 1
|
1月前
|
XML 监控 JavaScript
JavaScript 语言对企业上网监控的技术支持
在数字化企业环境中,上网监控对企业信息安全和提升员工效率至关重要。JavaScript 作为广泛应用的脚本语言,提供了强大的技术支持,包括数据获取与分析、与服务器端交互、监控页面加载时间和网络活动,助力企业有效管理上网行为,保障信息安全。
28 6
|
3月前
|
Web App开发 JavaScript 前端开发
Node.js与Go语言的对比?
【8月更文挑战第4天】Node.js与Go语言的对比?
368 3
|
3月前
|
自然语言处理 JavaScript 前端开发
【走向世界】Vue.js国际化:打造无国界应用,让爱与信息跨越语言的边界!
【8月更文挑战第30天】本文详细介绍了Vue.js中实现国际化的多种方法及最佳实践。通过使用`vue-i18n`等第三方库,开发者能够轻松地为应用添加多语言支持,优化用户体验并扩大市场覆盖范围。文章涵盖从基本配置、动态加载语言包到考虑文化差异等方面的内容,帮助读者构建真正全球化且无缝多语言体验的应用程序。
112 0
|
3月前
|
JavaScript 前端开发 UED
探索JavaScript的历史:网络需求初现、语言创立与标准化的旅程
探索JavaScript的历史:网络需求初现、语言创立与标准化的旅程
|
5月前
|
JavaScript 前端开发 编译器
ECMAScript与JavaScript:一场语言的邂逅
ECMAScript与JavaScript:一场语言的邂逅
|
6月前
|
JavaScript 测试技术
【sgGoogleTranslate】自定义组件:基于Vue.js用谷歌Google Translate翻译插件实现网站多国语言开发
【sgGoogleTranslate】自定义组件:基于Vue.js用谷歌Google Translate翻译插件实现网站多国语言开发
|
5月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的java语言的考试信息报名系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的java语言的考试信息报名系统附带文章源码部署视频讲解等
53 0
|
6月前
|
JavaScript 前端开发 Java
javascript是弱类型语言,一个函数参数可以接收不同类型的变量作为它的该参数
javascript是弱类型语言,一个函数参数可以接收不同类型的变量作为它的该参数
53 0
N..
|
6月前
|
存储 JavaScript 前端开发
JavaScript语言的基本结构
JavaScript语言的基本结构
N..
36 1