你应该知道的 JS 基础

Gentleman
250 阅读5分钟

原文标题：Javascript Fundamentals You need to know.

1.JS的基本数据类型

在JS种有7种基本数据类型。他们分别是string、number、bigint、 boolean、undefined、symbol和null。

那么，什么是基本数据类型呢？基本数据类型是指你无法直接修该值的数据类型。如果你想要修改基本数据类型的值的话，那么就需要重新赋新值，

在这里展示了你可以用基本数据类型做什么，不能做什么

let x = 10
x = 20;
̶x̶.̶p̶u̶s̶h̶(̶3̶0̶)̶

2.对象和函数值

对象和函数并不属于基本数据类型，因为我们可以直接通过代码修改对象和函数的值。假设您创建了一个包含五个朋友姓名列表的数组。几天后，您有了新朋友并想添加到列表中？你会怎么做？因为数据是一个对象所以可以直接修改。下面的代码展示了如何将这两个朋友姓名直接添加到前一个数组中。

//first you have 5 friends
let myFriend = ["Titu","Nitu","Ritu","Pappu"];
//now you have two more friend and you want add
myFriend.push("Zarin","Nasim");
console.log(myFriend)
//console.log result: (6) ["Titu", "Nitu", "Ritu", "Pappu", "Zarin", "Nasim"]

3.JS的表达式

表达式是每种编程语言的核心内容之一。它赋予编程语言生命。表达式一般采用2个或者多个值。之后，它处理这些值并将它们处理后的结果作为单个值返回。

下面的例子就展示了JS表达式的使用

let unitPrice = 30;
let totalCount = 10;
// now making result using expression
let totalPrice = (unitPrice * totalCount);
console.log(totalPrice);
//result: 300

4. Type Of

关于 javascript 的一项更基本和有趣的东西是 typeof。它用于检查由用户提供或由开发人员编写的变量值类型。它有许多实际用途；其中之一是输入框字段验证。如果用户错误地将字段置空或提供了不同类型的值，我们可以提示用户输入正确类型的值。

比如：用户要求在输入框字段中要求提供他/她的年龄，但用户错误地在该字段中提供了他/她的名字!这里 姓名(name)是字符串类型，年龄(age)是数字类型，在这种情况下，我们可以提醒用户给出正确类型的值。只要用户没有给出正确类型的值我们就会不断提醒用户给出正确类型的值。

代码示例：

let myAge = "Asif"
if (typeof (myAge) != 'number'){
  alert("you gave the wrong value");//here this line will pop up as alert because type of my age is not nuber
}
else{
  alert("thanks for giving your age");
}

5. Try-Catch(救生员)

编程的方式并不重要；因为你不能保证你的代码不会出错。发生这种情况的原因有很多，例如错误的代码、错误的用户响应或无法连接数据库等。

当代码出现错误时，try-catch有助于抓捕错误并反馈而不是杀死程序运行。

关于 try/catch你应该知道的三件事

  1. 它仅在运行时执行。
  2. 它无法解决语法错误
  3. 如果它被调度，它不能解决代码。

下面是使用try-catch的例子

let x = 10;
try{
  for(i = 0;  i < x; i++){
    console.log(i)// this line will print 0-9
  }
    console.log(w) 
  //here w is not defined so this line will give error and this will catch by catch method
  }
  catch(error){
    let msg = error.message;
    alert(msg);// here alert msg will show that w is not defined
  }

6. 交叉浏览测试

译者注：浏览器版本的兼容性问题

开发人员为其代码库运行交叉浏览测试很重要。因为从一个浏览器到另一个浏览器和旧版本浏览器到更新版本之间存在一些差异。如果一个网站不能在大多数浏览器中运行，那么它就不太实用。

那么您是否必须测试所有存在的浏览器？不，绝对不是，因为互联网上有数十万种浏览器，您无法对所有浏览器进行测试。你可以做的是你可以测试几个常见的浏览器来测试你书写的代码。

7. 展开运算符 (充满魔力的一点)

展开运算符有助于复制整个数组或对象，然后轻松添加一个或多个值。当我们想为对象添加值时，大多数时候会使用它。

例子:

let myFriend = ["Rahman","Kuddus","Sultan"];
let newFriend = ["jarina", "sakhina", "Beauty"];
let allFriends = [...myFriend,...newFriend];
console.log(allFriends);
// this console log will give name of all 6 friends
view rawspread.js hosted with ❤ by GitHub

8.块级作用域, var变量声明!

在 JavaScript 中我们可以使用var来灵活声明变量。它是一个泄漏变量，意思是它可以将值从块级元素泄漏到全局环境，从而导致全局值发生变化。

例子:

var globalValue = 3;
{
  // declaring golbal value in scope
  var golbalValue = 10;
}
console.log(golbalValue)
//output: 10; because var leaks scope value to global.

9. 块级作用域，const变量声明!

因为我们知道 const 是一种严格的变量声明，我们不能重复使用 const声明同名变量。但是在块级，我们知道块级元素不会给出超出范围的值或与全局变量发生冲突。所以我们可以同时在全局和局部范围内重新声明一个 const 变量。

例子:

const myName = "Murad"
{
  const myName = "Your Name"
  console.log(myName);
  //output: Your Name
}
console.log(myName);
//output: Murad

10.块级作用域，let变量声明!

在 JavaScript 中我们可以使用var来灵活声明变量。它不会将其作用域值被全局变量访问。而且它不是一个严格的类型，所以我们可以在块级别再次重新声明同一个变量，并且两个 let 变量保持它们自己的值。

例子:

let yourMoney = 500;
const moneyInEid = ()=> {
  let yourMoney = 1000;
  console.log(yourMoney);
  //output: 1000
}
moneyInEid()
console.log(yourMoney);
//output: 500;

译者注：var、let、const三种的区别译者在这个说明一下

  1. const声明的变量为常量，即只能声明一次且该变量值不可被修改
  2. var没有块级作用域，而let有块级作用域。

示例代码如下

const fns = [];

// 使用 var 定义变量i
for (var i = 0; i < 10; i++) {
 fns.push(() => {
   console.log(i);
 })
}

// 10 10 10 10 10 10 10 10 10 10
fns.forEach(fn => fn())

const fns = [];

// 使用 let 定义变量i
for (var i = 0; i < 10; i++) {
 fns.push(() => {
   console.log(i);
 })
}

// 0 1 2 3 4 5 6 7 8 9
fns.forEach(fn => fn())

关于更多内容可参考文章：let 和 const 命令

avatar
文章
阅读
粉丝