zoukankan      html  css  js  c++  java
  • FCC 基础JavaScript 练习6

    1.对象和数组很相似,数组是通过索引来访问和修改数据,对象是通过属性来访问和修改数据的,

    对象适合用来存储结构化数据,就和真实世界的对象一模一样,比如一只猫.

    任务

    创建一个叫做myDog对象,它里面有这些属性名称"name"腿"legs", 尾巴"tails"朋友"friends"

    你可以设置对象属性为任何你想要的值,只要 "name" 是字符串、 "legs""tails" 是数字、"friends" 是数组,

    // 请只修改这条注释以下的代码

    var myDog = {        //对象是
    "name": "Kitty",     //属性有"name","legs" ,"tails","friends",属性名之间用逗号分开
    "legs": 4,
    "tails": 1,
    "friends": ["mikey","bob",["tom","joy"]]

    };

    2.有两种方式访问对象属性,一个是点操作符(.),一个是中括号操作符([]),当你知道属性的名称的时候,使用点操作符

    任务

    通过点操作符读取对象testObj,把hat的属性值赋给变量hatValue,把shirt的属性值赋给shirtValue,

    // 初始化变量
    var testObj = {
    "hat": "ballcap",
    "shirt": "jersey",
    "shoes": "cleats"
    };

    // 请只修改这条注释以下的代码

    var hatValue = testObj.hat; // 请修改这一行//把对象testObj的属性hat的值赋给变量 hatValue 
    var shirtValue = testObj.shirt; // 请修改这一行//属性名没有空格,不需要加引号,用点号操作符,反之加引号和用中括号操作符

    3.如果你想访问的属性的名称有一个空格,这时你只能使用中括号操作符([]),

    提示:属性名称中如果有空格,必须把属性名称用单引号或双引号包裹起来

    任务

    用中括号操作符读取对象testObj的属性"an entree"值和属性"the drink"值,

    // 初始化变量
    var testObj = {
    "an entree": "hamburger",
    "my side": "veggies",
    "the drink": "water"
    };

    // 请只修改这条注释以下的代码

    var entreeValue = testObj['an entree']; // 请修改这一行
    var drinkValue = testObj["the drink"]; // 请修改这一行

    4.中括号操作符的另一个使用方式是用变量来访问一属性

    当你需要遍历对象的属性列表或查表时,这种方式极为有用,

    提示:当我们通过变量名访问属性的时候,不需要给变量名包裹引号。因为实际上我们使用的是变量的值,而不是变量的名称

    任务

    使用变量 playerNumber,通过中括号操作符找到 testObjplayerNumber16 的值

    // 初始化变量
    var testObj = {
    12: "Namath",
    16: "Montana",
    19: "Unitas"
    };

    // 请只修改这条注释以下的代码

    var playerNumber=16; // 修改这一行
    var player = testObj[playerNumber]; // 修改这一行

     

    5.当你创建了一个对象后,你可以用点操作符或中括号操作符更新对象的属性,

    任务

    更新 myDog 对象的name属性,让它的名字从 "Coder" 变成 "Happy Coder"

    // 初始化变量
    var myDog = {
    "name": "Coder",
    "legs": 4,
    "tails": 1,
    "friends": ["Free Code Camp Campers"]
    };

    // 请把你的代码写在这条注释以下
    myDog.name="Happy Coder";//有点类似于数组更改的方式

    6.可以像更改属一样给对象添加属性

    任务

    myDog添加一个"bark" 属性,设置它的值为狗的声音,例如:"woof"

    // 初始化变量
    var myDog = {
    "name": "Happy Coder",
    "legs": 4,
    "tails": 1,
    "friends": ["Free Code Camp Campers"]
    };

    // 请把你的代码写在这条注释以下
    myDog.bark="woof";

     

    7.同样可以删除对象的属性,例如:

    delete ourDog.bark;

     

    任务

    删除myDog对象的"tails"属性

    // 初始化变量
    var myDog = {
    "name": "Happy Coder",
    "legs": 4,
    "tails": 1,
    "friends": ["Free Code Camp Campers"],
    "bark": "woof"
    };

    // 请把你的代码写在这条注释以下

    delete myDog.tails;

    8.任务

    把switch语句转化为一个叫做lookup的对象

    /////////////////////////////////////////////////////////////////

    // 定义 phoneticLookup
    function phoneticLookup(val) {
    var result = "";

    // 请只修改这条注释以下的代码
    switch(val) {
    case "alpha":
    result = "Adams";
    break;
    case "bravo":
    result = "Boston";
    break;
    case "charlie":
    result = "Chicago";
    break;
    case "delta":
    result = "Denver";
    break;
    case "echo":
    result = "Easy";
    break;
    case "foxtrot":
    result = "Frank";
    }

    // 请只修改这条注释以上的代码
    return result;
    }

    /////////////////////////////////////////////////////////////////

    // 定义 phoneticLookup
    function phoneticLookup(val) {
    var result = "";

    // 请只修改这条注释以下的代码
    var lookup={
    "alpha":"Adams",
    'bravo':'Boston',
    'charlie':'Chicago',
    'delta':"Denver",
    'echo':"Easy",
    'foxtrot':"Frank"
    };

    // 请只修改这条注释以上的代码
    result = lookup[val];
    return result;
    }

    // 你可以修改这一行来测试你的代码
    phoneticLookup("charlie");

    9.我们可以用.hasOwnProperty(属性名)  //属性名是字符串要加引号//

    方法来检查对象是否有该属性,如果有返回true,反之返回 false,

    // 初始化变量
    var myObj = {
    gift: "pony",
    pet: "kitten",
    bed: "sleigh"
    };

    function checkObj(checkProp) {
    // 请把你的代码写在这条注释以下
    var tr = myObj.hasOwnProperty(checkProp); //检查对象是否存在,将结果赋值给tr
    if(tr===true){ //判断tr是否true ?(存在)
    return myObj[checkProp]; // //存在则返回属性对应的值
    }else{
    return "Not Found"; //不存在,则返回“Not Found”
    } }
    // 你可以修改这一行来测试你的代码
    checkObj("gift");

    10.JavaScript Object Notation 简称 JSON,它使用JavaScript对象的格式来存储数据,

    JSON是灵活的,因为它允许 数据结构字符串数字布尔值字符串对象 的任意组合

    提示
    数组中有多个 JSON 对象的时候,对象与对象之间要用逗号隔开

    var myMusic = [
    {
    "artist": "Billy Joel",
    "title": "Piano Man",
    "release_year": 1973,
    "formats": [
    "CS",
    "8T",
    "LP" ],
    "gold": true

    },
    { "artist": "Billy Joel",
    "title": "Piano Man",
    "release_year": 1973,
    "formats": [
    "CS",
    "8T",
    "LP" ]},// 请在这里添加专辑
    ];

    11.

    任务

    检索JSON对象 myStorage 中嵌套属性 glove box 的值,

    因为属性的名字带有空格,请使用中括号操作符来访问属性的值

    var myStorage = {
    "car": {
    "inside": {
    "glove box": "maps",
    "passenger seat": "crumbs"
    },
    "outside": {
    "trunk": "jack"
    }
    }
    };

    // 请只修改这条注释以下的代码

    var gloveBoxContents =myStorage.car.inside["glove box"] ; // 请修改这一行

    12.

    任务

    使用点操作符和中括号操作符来检索变量 myPlants 的第二棵树

    // 初始化变量
    var myPlants = [
    {
    type: "flowers",
    list: [
    "rose",
    "tulip",
    "dandelion"
    ]
    },
    {
    type: "trees",
    list: [
    "fir",
    "pine",
    "birch"
    ]
    }
    ];

    // 请只修改这条注释以下的代码

    var secondTree =myPlants[1].list[1]; // 请修改这一行

    13.

    右边有一个JSON对象,代表着你的专辑集。每一张专辑由一个唯一的id标识,并具有多种属性。但并非所有的专辑都有完整的信息。

    写一个函数,它有个三个参数,idpropvalue

    如果 value !='' 而且prop != 'tracks'collectionCopy[id][prop]=value;

    如果 value !='' 而且prop == 'tracks'collectionCopy[id][prop].push(value);

    如果 value == ''delete collectionCopy[id][prop];

    记住:函数返回的永远是整个对象。

    提示
    使用中括号操作符来 访问对象的变量属性,

     

     

    // 初始化变量
    var collection = {
    2548: {
    album: "Slippery When Wet",
    artist: "Bon Jovi",
    tracks: [
    "Let It Rock",
    "You Give Love a Bad Name"
    ]
    },
    2468: {
    album: "1999",
    artist: "Prince",
    tracks: [
    "1999",
    "Little Red Corvette"
    ]
    },
    1245: {
    artist: "Robert Palmer",
    tracks: [ ]
    },
    5439: {
    album: "ABBA Gold"
    }
    };
    // 深拷贝 collection,用于测试
    var collectionCopy = JSON.parse(JSON.stringify(collection));

    // 请只修改这条注释以下的代码
    function update(id, prop, value) {
    if(value !==''&&prop !=='tracks'){
    collectionCopy[id][prop]=value;
    }
    else if(value !==''&&prop =='tracks'){
    collectionCopy[id][prop].push(value);
    }
    else if(value ===''){
    delete collectionCopy[id][prop];
    }

    return collection;
    }

    // 你可以修改这一行来测试你的代码
    update(5439, "artist", "ABBA");

    14.

    一个条件语句只能执行一次代码,而一个循环语句可以多次执行代码,

    JavaScript 中最常见的循环就是for循环”,

    for循环中的三个表达式用分号隔开:

    for ([初始化]; [条件判断]; [计数器])

    初始化语句只会在执行循环开始之前执行一次。它通常用于定义和设置你的循环变量,

    条件判断语句会在每一轮循环的开始执行,只要条件判断为 true 就会继续执行循环。当条件为 false的时候,

    循环将停止执行,这意味着,如果条件在一开始就为 false,这个循环将不会执行,

    计数器是在每一轮循环结束时执行,通常用于递增或递减,

    任务

    使用 for 循环把从 1 到 5 添加进 myArray 中。

    for循环就是if条件语句的进化版

    // 请把你的代码写在这条注释以下

    var myArray=[];
    for (var i=1;i<6;i++){
    myArray.push(i);
    }

     

    15.

    任务

    写一个 for 循环,把从1到9的奇数添加到 myArray

    // 初始化变量
    var myArray = [];

    // 请把你的代码写在这条注释以下
    for(i=1;i<10;i+=2){
    myArray.push(i);
    }

    16.for循环也可以逆向迭代,只要我们定义好合适的条件,

    为了能够从后往前两两倒数,我们需要改变我们的 初始化条件判断计数器

    任务

    使用一个 for 循环,把9到1的奇数添加进 myArray

     

    // 初始化变量
    var myArray = [];

    // 请把你的代码写在这条注释以下

    for(i=9;i>0;i-=2){
    myArray.push(i);
    }

    17迭代输出一个数组的每个元素是 JavaScript 中的常见需求, for 循环可以做到这一点,

    记住数组的索引从零开始的,这意味着数组的最后一个元素的下标是:数组的长度 - 1,

    任务

    声明并初始化一个变量 total0。使用 for循环,使得 total 的值为 myArr 的数组中的每个元素的值的总和

    // 初始化变量
    var myArr = [ 2, 3, 4, 5, 6];

    // 请把你的代码写在这条注释以下
    var total=0;
    for(var i=0;i<myArr.length;i++){
    total+=myArr[i];
    }

    18.如果你有一个二维数组,可以使用相同的逻辑,先遍历外面的数组,再遍历里面的子数组,

    一次输出 arr 中的每个子元素。提示,对于内部循环,我们可以通过 arr[i].length 来获得子数组的长度,

    因为 arr[i] 的本身就是一个数组

    任务

    修改函数 multiplyAll,获得 arr 内部数组的每个数字相乘的结果 product,

     

    function multiplyAll(arr) {            ///////不要把函数,变量,参数搞混
    var product = 1;
    // 请把你的代码写在这条注释以下
    for(var i=0;i<arr.length;i++){
    for(var j=0;j<arr[i].length;j++) {


    product*=arr[i][j];}}
    // 请把你的代码写在这条注释以上
    return product;
    }

    // 你可以修改这一行来测试你的代码
    multiplyAll([[1,2],[3,4],[5,6,7]]);

    19.另一种类型的 JavaScript 循环被称为while循环

    因为它规定,当(while)条件为真,循环才会执行,反之不执行,

    任务

    通过一个 while 循环,把从 0 到 4 的值添加到 myArray

    // 初始化变量
    var myArray = [];

    // 请把你的代码写在这条注释以下
    var i=0;
    while(i<5){
    myArray.push(i);
    i++;
    }

    20.

    函数 lookUp 有两个预定义参数:firstName值和prop属性 ,

    函数将会检查通讯录中是否存在一个与传入的 firstName 相同的联系人,

    如果存在,那么还需要检查对应的联系人中是否存在 prop属性,

    如果它们都存在,函数返回prop属性对应的值。

    如果firstName 值不存在,返回 "No such contact"

    如果prop 属性不存在,返回 "No such property",

     

     

    //初始化变量
    var contacts = [
    {
    "firstName": "Akira",
    "lastName": "Laine",
    "number": "0543236543",
    "likes": ["Pizza", "Coding", "Brownie Points"]
    },
    {
    "firstName": "Harry",
    "lastName": "Potter",
    "number": "0994372684",
    "likes": ["Hogwarts", "Magic", "Hagrid"]
    },
    {
    "firstName": "Sherlock",
    "lastName": "Holmes",
    "number": "0487345643",
    "likes": ["Intriguing Cases", "Violin"]
    },
    {
    "firstName": "Kristian",
    "lastName": "Vos",
    "number": "unknown",
    "likes": ["Javascript", "Gaming", "Foxes"]
    }
    ];


    function lookUp(firstName, prop){
    // 请把你的代码写在这条注释以下
    for (var i in contacts)
    {if (contacts[i].firstName === firstName && prop in contacts[i])
    return contacts[i][prop];}
    for ( i in contacts)
    { if (prop in contacts[i] ===false)
    return "No such property";
    }
    for ( i in contacts)
    { if (contacts[i].firstName !== firstName)
    return "No such contact";}

    // 请把你的代码写在这条注释以上
    }

    // 你可以修改这一行来测试你的代码
    lookUp("Akira", "likes");

  • 相关阅读:
    pycharm快捷键、常用设置、包管理
    【转载】TCP socket心跳包示例程序
    【转载】C++定时器实现
    金龙一卡通登陆爬取数据 免验证码 多线程 学生卡 CAUC
    python3 正方教务系统 爬取数据
    29、Python之Web框架Django入门
    28、Python之前端组件学习
    27、Python之jQuery基础
    26、Python之JavaScript进阶篇
    25、Python之JavaScript基础
  • 原文地址:https://www.cnblogs.com/luxiaoli/p/7976583.html
Copyright © 2011-2022 走看看