首页 > web前端 > js教程 > 正文

JavaScript 备忘单

王林
发布: 2024-08-08 03:41:12
原创
1195 人浏览过

JavaScript Cheat Sheets

Hey everyone! I've got some great news for all you beginners learning JavaScript! A quick reference guide for JavaScript is now available! You can easily check important concepts, functions, and methods right away. For more details about the guide, check it out here.

What's in the Quick Reference Guide

Console

// => Hello world!
console.log("Hello world!");

// => Hello CheatSheets.zip
console.warn("hello %s", "CheatSheets.zip");

// Output error message to standard error
console.error(new Error("Oops!"));
登录后复制

Numbers

let amount = 6;
let price = 4.99;
登录后复制

Variables

let x = null;
let name = "Tammy";
const found = false;

// => Tammy, false, null
console.log(name, found, x);

var a;
console.log(a); // => undefined
登录后复制

Strings

let single = "Wheres my bandit hat?";
let double = "Wheres my bandit hat?";

// => 21
console.log(single.length);
登录后复制

Arithmetic Operators

5 + 5 = 10     // Addition
10 - 5 = 5     // Subtraction
5 * 10 = 50    // Multiplication
10 / 5 = 2     // Division
10 % 5 = 0     // Modulus
登录后复制

Comments

// This is a comment

/*
You need to change this setting
before deployment.
*/
登录后复制

Assignment Operators

let number = 100;

// Both statements add 10
number = number + 10;
number += 10;

console.log(number);
// => 120
登录后复制

String Interpolation

let age = 7;

// String concatenation
"Tommy is " + age + " years old.";

// String interpolation
`Tommy is ${age} years old.`;
登录后复制

Conditional Statements

const isMailSent = true;

if (isMailSent) {
  console.log("Mail sent to recipient");
}
登录后复制

Ternary Operator

var x = 1;

// => true
result = x == 1 ? true : false;
登录后复制

Logical Operators

true || false; // true
10 > 5 || 10 > 20; // true
false || false; // false
10 > 100 || 10 > 20; // false
登录后复制

Comparison Operators

1 > 3; // false
3 > 1; // true
250 >= 250; // true
1 === 1; // true
1 === 2; // false
1 === "1"; // false
登录后复制

Arrays

const fruits = ["apple", "orange", "banana"];

// Different data types
const data = [1, "chicken", false];
登录后复制

Objects

const apple = {
  color: "Green",
  price: { bulk: "$3/kg", smallQty: "$4/kg" },
};
console.log(apple.color); // => Green
console.log(apple.price.bulk); // => $3/kg
登录后复制

Classes

class Dog {
  constructor(name) {
    this._name = name;
  }

  introduce() {
    console.log("This is " + this._name + " !");
  }

  // Static method
  static bark() {
    console.log("Woof!");
  }
}

const myDog = new Dog("Buster");
myDog.introduce();

// Calling static method
Dog.bark();
登录后复制

Modules

// myMath.js

// Default export
export default function add(x, y) {
  return x + y;
}

// Named export
export function subtract(x, y) {
  return x - y;
}

// Multiple exports
function multiply(x, y) {
  return x * y;
}
function duplicate(x) {
  return x * 2;
}
export { multiply, duplicate };
登录后复制

Asynchronous Processing

function helloWorld() {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve("Hello World!");
    }, 2000);
  });
}

async function msg() {
  const msg = await helloWorld();
  console.log("Message:", msg);
}

msg(); // Message: Hello World! <-- after 2 seconds
登录后复制

This quick reference guide covers a wide range of topics from the basics to more advanced JavaScript concepts. Be sure to download it here and make it a handy tool for your coding journey!

以上是JavaScript 备忘单的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:dev.to
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!