我们知道ð§§的对象
#javascript #编程 #objects #love

## JavaScript中的所有内容,即:对象

范围

变量是编程中的基本部分。我们声明变量存储不同的数据类型。要声明一个变量,我们使用关键词 var let const 。可以在不同范围内声明变量。在本节中,我们将看到范围变量,当使用VAR或LET时的变量范围。
变量范围可以是:

  • 全球
  • Local

可以在全球或本地范围内声明变量。我们将看到全球和本地范围。
没有让,var或const范围内声明的任何声明。

让我们想象我们有一个范围。

窗口全局对象

不使用Console.log()打开浏览器并检查,如果您在浏览器上编写A或B的值,您将看到A和B的值。这意味着A和B在窗口中已经可用。

//scope.js
a = "JavaScript"; // declaring a variable without let or const make it available in window object and this found anywhere
b = 10; // this is a global scope variable and found in the window object
function letsLearnScope() {
  console.log(a, b);
  if (true) {
    console.log(a, b);
  }
}
console.log(a, b); // accessible

全球范围

可以在同一文件中访问全球声明的变量。但是“全球”一词是相对的。它可以是全局文件的全局,也可以相对于某些代码块而言是全局

//scope.js
let a = "JavaScript"; // is a global scope it will be found anywhere in this file
let b = 10; // is a global scope it will be found anywhere in this file
function letsLearnScope() {
  console.log(a, b); // JavaScript 10, accessible
  if (true) {
    let a = "Python";
    let b = 100;
    console.log(a, b); // Python 100
  }
  console.log(a, b);
}
letsLearnScope();
console.log(a, b); // JavaScript 10, accessible

本地范围

仅在某些块代码中访问为本地的变量。

  • 块范围
  • 功能范围
//scope.js
let a = "JavaScript"; // is a global scope it will be found anywhere in this file
let b = 10; // is a global scope it will be found anywhere in this file
// Function scope
function letsLearnScope() {
  console.log(a, b); // JavaScript 10, accessible
  let value = false;
  // block scope
  if (true) {
    // we can access from the function and outside the function but
    // variables declared inside the if will not be accessed outside the if block
    let a = "Python";
    let b = 20;
    let c = 30;
    let d = 40;
    value = !value;
    console.log(a, b, c, value); // Python 20 30 true
  }
  // we can not access c because c's scope is only the if block
  console.log(a, b, value); // JavaScript 10 true
}
letsLearnScope();
console.log(a, b); // JavaScript 10, accessible

现在,您对范围有了解。用 var 声明的变量仅范围范围范围,但用 lem> let const 声明的变量为块范围(功能块,如果块,loop block,loop块, ETC)。 JavaScript中的块是两个卷发支架({})之间的代码。

//scope.js
function letsLearnScope() {
  var gravity = 9.81;
  console.log(gravity);
}
// console.log(gravity), Uncaught ReferenceError: gravity is not defined

if (true) {
  var gravity = 9.81;
  console.log(gravity); // 9.81
}
console.log(gravity); // 9.81

for (var i = 0; i < 3; i++) {
  console.log(i); // 0, 1, 2
}
console.log(i); // 3

在ES6及以上有 LET const ,因此您不会遭受 var 的偷偷摸摸。当我们使用 LET 时,我们的变量是块范围的,它不会感染代码的其他部分。

//scope.js
function letsLearnScope() {
  // you can use let or const, but gravity is constant I prefer to use const
  const gravity = 9.81;
  console.log(gravity);
}
// console.log(gravity), Uncaught ReferenceError: gravity is not defined

if (true) {
  const gravity = 9.81;
  console.log(gravity); // 9.81
}
// console.log(gravity), Uncaught ReferenceError: gravity is not defined

for (let i = 0; i < 3; i++) {
  console.log(i); // 0, 1, 2
}
// console.log(i), Uncaught ReferenceError: i is not defined

范围 const 是相同的。差异只是重新分配。我们无法更改或重新分配const变量的值。我强烈建议您使用 let const ,使用 let const 您将编写干净的代码和避免难以调试错误。根据经验,您可以将 let 用于任何更改的值, const 用于任何常数值,以及数组,对象,箭头函数和函数表达式。<<<<<<<<<<< /p>

ð对象

一切都可以是一个对象,并且对象确实具有属性,并且属性具有值,因此对象是键值对。密钥的顺序不是保留,或者没有顺序。
为了创建一个字面的对象,我们使用两个卷曲括号。

创建一个空对象

一个空的对象

const person = {};

用价值创建一个反对

现在,人对象具有名称,姓氏,年龄,位置,技能和属性的属性。属性或密钥的值可能是字符串,数字,布尔值,对象,空,未定义或功能。

让我们看看对象的一些示例。每个键在对象中都有一个值。

const rectangle = {
  length: 20,
  width: 20,
};
console.log(rectangle); // {length: 20, width: 20}

const person = {
  firstName: "MD",
  lastName: "Shaikh",
  age: 250,
  country: "INDIA",
  city: "Mum",
  skills: [
    "HTML",
    "CSS",
    "JavaScript",
    "React",
    "Node",
    "MongoDB",
    "Python",
    "D3.js",
  ],
  isMarried: false,
};
console.log(person);

从对象获取值

我们可以使用两种方法访问对象的值:

  • 使用。其次是关键名称,如果密钥名是一个单词
  • 使用方括号和报价
const person = {
  firstName: "MD",
  lastName: "Shaikh",
  age: 250,
  country: "INDIA",
  city: "Mum",
  skills: [
    "HTML",
    "CSS",
    "JavaScript",
    "React",
    "Node",
    "MongoDB",
    "Python",
    "D3.js",
  ],
  getFullName: function () {
    return `${this.firstName}${this.lastName}`;
  },
  "phone number": "+3584545454545",
};

// accessing values using .
console.log(person.firstName);
console.log(person.lastName);
console.log(person.age);
console.log(person.location); // undefined

// value can be accessed using square bracket and key name
console.log(person["firstName"]);
console.log(person["lastName"]);
console.log(person["age"]);
console.log(person["age"]);
console.log(person["location"]); // undefined

// for instance to access the phone number we only use the square bracket method
console.log(person["phone number"]);

创建对象方法

现在,人对象具有fullname属性。 getfullname是人对象内部的函数,我们称其为对象方法。 this 关键词是指对象本身。我们可以使用这个 this 访问对象的不同属性的值。我们无法将箭头函数用作对象方法,因为该单词是指箭头函数内的窗口而不是对象本身。对象的示例:

const person = {
  firstName: "MD",
  lastName: "Shaikh",
  age: 250,
  country: "INDIA",
  city: "Mum",
  skills: [
    "HTML",
    "CSS",
    "JavaScript",
    "React",
    "Node",
    "MongoDB",
    "Python",
    "D3.js",
  ],
  getFullName: function () {
    return `${this.firstName} ${this.lastName}`;
  },
};

console.log(person.getFullName());
// MD Shaikh

为对象设置新键

一个对象是一种可变的数据结构,我们可以在对象创建后修改其内容。

在对象中设置新密钥

const person = {
  firstName: "MD",
  lastName: "Shaikh",
  age: 250,
  country: "INDIA",
  city: "Mum",
  skills: [
    "HTML",
    "CSS",
    "JavaScript",
    "React",
    "Node",
    "MongoDB",
    "Python",
    "D3.js",
  ],
  getFullName: function () {
    return `${this.firstName} ${this.lastName}`;
  },
};
person.nationality = "Ethiopian";
person.country = "INDIA";
person.title = "teacher";
person.skills.push("Meteor");
person.skills.push("SasS");
person.isMarried = true;

person.getPersonInfo = function () {
  let skillsWithoutLastSkill = this.skills
    .splice(0, this.skills.length - 1)
    .join(", ");
  let lastSkill = this.skills.splice(this.skills.length - 1)[0];

  let skills = `${skillsWithoutLastSkill}, and ${lastSkill}`;
  let fullName = this.getFullName();
  let statement = `${fullName} is a ${this.title}.\nHe lives in ${this.country}.\nHe teaches ${skills}.`;
  return statement;
};
console.log(person);
console.log(person.getPersonInfo());
MD Shaikh is Learning Js.
He lives in INDIA.
He Knows HTML, CSS, JavaScript, React, Node, MongoDB, Python, D3.js, Meteor, and SasS.

对象方法

有不同的方法来操纵对象。让我们看看一些可用的方法。

object.assign :在不修改原始对象的情况下复制对象

const person = {
  firstName: "MD",
  age: 250,
  country: "INDIA",
  city: "Mum",
  skills: ["HTML", "CSS", "JS"],
  title: "teacher",
  address: {
    street: "Heitamienkatu 16",
    pobox: 2002,
    city: "Mum",
  },
  getPersonInfo: function () {
    return `I am ${this.firstName} and I live in ${this.city}, ${this.country}. I am ${this.age}.`;
  },
};

//Object methods: Object.assign, Object.keys, Object.values, Object.entries
//hasOwnProperty

const copyPerson = Object.assign({}, person);
console.log(copyPerson);

使用object.keys()获取对象键

object.keys :将对象的键或属性作为数组

const keys = Object.keys(copyPerson);
console.log(keys); //['firstName', 'age', 'country','city', 'skills','title', 'address', 'getPersonInfo']
const address = Object.keys(copyPerson.address);
console.log(address); //['street', 'pobox', 'city']

使用object.values()获取对象值

object.values :将对象的值作为数组
获取

const values = Object.values(copyPerson);
console.log(values);

使用object.entries()获取对象键和值

object.entries :在数组中获取键和值

const entries = Object.entries(copyPerson);
console.log(entries);

使用HasownProperty()检查属性

HasownProperty :检查对象中是否存在特定的键或属性

console.log(copyPerson.hasOwnProperty("name"));
console.log(copyPerson.hasOwnProperty("score"));

ð你很惊讶。现在,您将获得对象的力量。您刚刚完成了第8天的挑战,并且您要达到8个步骤,进入伟大之路。现在为您的大脑和肌肉做一些运动。

ð»练习

练习:1级

  1. 创建一个称为狗的空对象
  2. 在控制台上打印狗对象
  3. 添加狗对象的名称,腿,颜色,年龄和树皮特性。树皮属性是返回 woof woof 的方法
  4. 从狗对象获取名称,腿,颜色,年龄和树皮价值
  5. 设置新属性狗对象:品种,getDoginfo

练习:2级

  1. 找到在用户对象中具有许多技能的人。
  2. 计数已记录在用户中,计数用户与以下对象的数量高于50点。
   const users = {
     Alex: {
       email: 'alex@alex.com',
       skills: ['HTML', 'CSS', 'JavaScript'],
       age: 20,
       isLoggedIn: false,
       points: 30
     },
     Asab: {
       email: 'asab@asab.com',
       skills: ['HTML', 'CSS', 'JavaScript', 'Redux', 'MongoDB', 'Express', 'React', 'Node'],
       age: 25,
       isLoggedIn: false,
       points: 50
     },
     Brook: {
       email: 'daniel@daniel.com',
       skills: ['HTML', 'CSS', 'JavaScript', 'React', 'Redux'],
       age: 30,
       isLoggedIn: true,
       points: 50
     },
     Daniel: {
       email: 'daniel@alex.com',
       skills: ['HTML', 'CSS', 'JavaScript', 'Python'],
       age: 20,
       isLoggedIn: false,
       points: 40
     },
     John: {
       email: 'john@john.com',
       skills: ['HTML', 'CSS', 'JavaScript', 'React', 'Redux', 'Node.js'],
       age: 20,
       isLoggedIn: true,
       points: 50
     },
     Thomas: {
       email: 'thomas@thomas.com',
       skills: ['HTML', 'CSS', 'JavaScript', 'React'],
       age: 20,
       isLoggedIn: false,
       points: 40
     },
     Paul: {
       email: 'paul@paul.com',
       skills: ['HTML', 'CSS', 'JavaScript', 'MongoDB', 'Express', 'React', 'Node'],
       age: 20,
       isLoggedIn: false,
       points: 40
     }
   }```





  1. 找到来自用户对象的Mern Stack开发人员的人
  2. 在用户对象中设置您的名称而不修改原始用户对象
  3. 获取用户对象的所有密钥或属性
  4. 获取用户对象的所有值
  5. 使用国家对象打印国家名称,资本,人口和语言。

练习:3级

  1. 创建一个称为 personAccount的对象。它具有名称,姓氏,收入,费用属性属性,并具有 TotalIncome,totalexpense,AccountInfo,AddeDincome,Addexpense Accountalance Accountalance 方法。收入是一组收入,其描述和费用是一组收入及其描述。
  2. ****问题:2、3和4基于以下两个阵列:用户和产品()

js
const users = [
  {
    _id: "ab12ex",
    username: "Alex",
    email: "alex@alex.com",
    password: "123123",
    createdAt: "08/01/2020 9:00 AM",
    isLoggedIn: false,
  },
  {
    _id: "fg12cy",
    username: "Asab",
    email: "asab@asab.com",
    password: "123456",
    createdAt: "08/01/2020 9:30 AM",
    isLoggedIn: true,
  },
  {
    _id: "zwf8md",
    username: "Brook",
    email: "brook@brook.com",
    password: "123111",
    createdAt: "08/01/2020 9:45 AM",
    isLoggedIn: true,
  },
  {
    _id: "eefamr",
    username: "Martha",
    email: "martha@martha.com",
    password: "123222",
    createdAt: "08/01/2020 9:50 AM",
    isLoggedIn: false,
  },
  {
    _id: "ghderc",
    username: "Thomas",
    email: "thomas@thomas.com",
    password: "123333",
    createdAt: "08/01/2020 10:00 AM",
    isLoggedIn: false,
  },
];

const products = [
  {
    _id: "eedfcf",
    name: "mobile phone",
    description: "Huawei Honor",
    price: 200,
    ratings: [
      { userId: "fg12cy", rate: 5 },
      { userId: "zwf8md", rate: 4.5 },
    ],
    likes: [],
  },
  {
    _id: "aegfal",
    name: "Laptop",
    description: "MacPro: System Darwin",
    price: 2500,
    ratings: [],
    likes: ["fg12cy"],
  },
  {
    _id: "hedfcg",
    name: "TV",
    description: "Smart TV:Procaster",
    price: 400,
    ratings: [{ userId: "fg12cy", rate: 5 }],
    likes: ["fg12cy"],
  },
];


想象您正在从mongoDB数据库中获取上述用户收集。
A。创建一个称为注册的函数,该功能允许用户添加到集合中。如果存在用户,请告知用户他已经有一个帐户。

b。创建一个称为signin的函数,该功能允许用户登录到应用程序

  1. 产品阵列具有三个元素,每个元素都有六个属性。
    A。创建一个称为Rateproduct的函数,该功能对产品进行评分
    b。创建一个称为平均的函数,该函数计算产品的平均额定值

  2. 创建一个称为类似产品的函数。如果不喜欢并将其删除,此功能将有助于对产品的使用。

ð它与javaScript中的对象有关! ð