JavaScript 常用的基础属性和概念 笔记

前言

是的,你没有看错。博主开始学习从零开始学习js了。

之前的css基础已经学习完,高级进阶的等到时候用的时候再查资料。

不然时间长了一样会忘记,还是把基础的记牢,基本上也都够用了!

后面应该也会写一篇方便查阅的全集笔记—我的域名还是很好记的;

所以大家有兴趣的也可以直接跳转过来查看笔记。

现在开始 Js 时间!

笔记

  • 变量(Variables)

用于存储数据值。在 ES6 之前,主要使用 var 关键字来声明变量。

ES6 引入了 let 和 const,提供了块级作用域和不可变性

var message = "Hello, World!";
let count = 0;
const PI = 3.14159;

 

  • 数据类型(Data Types)

String(字符串)、

Number(数字)、

Boolean(布尔值)、

Null(空)、

Undefined(未定义)、

Object(对象)、

Symbol(ES6 新增,表示独一无二的值)

 

  • 操作符(Operators)

包括算术操作符、赋值操作符、比较操作符、逻辑操作符等

const result = 3 + 5; // 算术操作
result > 10 ? console.log('大于10') : console.log('小于等于10'); // 条件(三元)操作符

 

  • 控制结构(Control Structures)

如条件语句 if、循环语句 forwhile 和 do...while

if (user.hasAccess) {
  // 执行某些操作
}

for (let i = 0; i < items.length; i++) {
  // 循环操作
}

 

  • 函数(Functions)

封装了可重复使用的代码块

function greet(name) {
  console.log('Hello, ' + name);
}

greet('Alice'); // 输出: Hello, Alice

 

  • 数组(Arrays)

用于存储多个值的集合

const numbers = [1, 2, 3, 4, 5];
console.log(numbers[0]); // 输出: 1

 

  • 对象(Objects)

存储键值对的集合,键是字符串,值可以是任意数据类型

const person = {
  name: 'Alice',
  age: 30,
  greet: function() {
    console.log('Hello, I am ' + this.name);
  }
};

person.greet(); // 输出: Hello, I am Alice

 

  • 解构赋值(Destructuring Assignment)

允许你从数组或对象中提取数据并赋值给新的变量

const [a, b] = [1, 2];
const { name, age } = person;

 

  • 类(Classes)

ES6 引入的面向对象编程的一个语法糖,它提供了一种新的语法来定义对象的原型和继承

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  greet() {
    console.log('Hello, I am ' + this.name);
  }
}

const alice = new Person('Alice', 30);
alice.greet(); // 输出: Hello, I am Alice

 

  • 模块(Modules)

允许你将代码逻辑分割成独立的模块

// math.js
export function add(a, b) {
  return a + b;
}

// main.js
import { add } from './math.js';
console.log(add(1, 2)); // 输出: 3

 

  • Promises 和异步编程(Promises and Asynchronous Programming)

用于异步操作,如网络请求、定时器等

const promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Hello, World!');
  }, 1000);
});

promise.then((value) => {
  console.log(value); // 输出: Hello, World!
});

 

  • 错误处理(Error Handling)

使用 try...catch 语句来捕获和处理错误

try {
  const result = someFunctionThatMightFail();
} catch (error) {
  console.error(error);
}

 

  • for 循环

用于已知迭代次数的情况

for (var i = 0; i < 10; i++) {
  console.log(i); // 从0到9打印数字
}
  • while 循环

当循环条件为真时,重复执行代码块

var i = 0;
while (i < 10) {
  console.log(i);
  i++;
}
  • do…while 循环

至少执行一次代码块,然后检查条件是否为真,如果是,继续执行循环

var i = 0;
do {
  console.log(i);
  i++;
} while (i < 10);
  • for…in 循环

遍历对象的属性

var obj = { a: 1, b: 2, c: 3 };
for (var prop in obj) {
  console.log(prop + ': ' + obj[prop]);
}
  • for…of 循环

遍历可迭代对象(如数组、字符串、Map,Set等)

var arr = ['apple', 'banana', 'cherry'];
for (var fruit of arr) {
  console.log(fruit);
}

 

 

 

随着 JavaScript 语言的不断发展,新的功能和特性也在不断被引入,努力学习强化自己吧!

JavaScript – 学习 Web 开发 | MDN (mozilla.org)

 

 

© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容