javascript JavaScript高级概念

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了javascript JavaScript高级概念相关的知识,希望对你有一定的参考价值。

function generator(input) {
  var number = input;
  
  return function() {
    return number * 2;
  }
}

var calc = generator(500);
console.log(calc());
const points = [
  [4, 5],  
  [1, 8],  
  [8, 12],  
];

points.map( ([x, y]) => {
  return {x, y};    //returns [{x: 4, y: 5}, {x: 1, y:8}, {x: 8, y:12}]
});
//Call
var john = {
    name: 'John',
    age: 26,
    job: 'teacher',
    presentation: function  (style, timeOfDay) {
        if(style === 'formal') {
            console.log('Good' + timeOfDay + ', Ladies and gentlemen. I\'m' + this.name + ', I\'m ' + this.job);
        } else if (style === 'friendly') {
            console.log('Hey! What\'s up? I\'m ' +  this.name + ', I\'m a ' + this.job + ' and I\'m ' + this.age + ' years old. Have a nice ' + timeOfDay + '.');
        }
    }
}

var emily = {
    name: 'Emily',
    age: 35,
    job: 'designer'
};

john.presentation('formal', 'morning');

john.presentation.call(emily, 'friendly', 'afternoon');

//Apply 
//Apply is the same as call but expects parameters in an array


//Bind
//Bind function assign the function that we call to a variable and we can preset some arguments in advance
var johnFriendly = john.presentation.bind(john, 'friendly');

johnFriendly('morning');
johnFriendly('night');

var emilyFormal = john.presentation.bind(emily, 'formal');

emilyFormal('afternoon');

// Another example of bind
var years = [1990, 1965, 1937, 2005, 1998];

function arrayCalc(arr, fn) {
    var arrRes = [];
    for (var i = 0; i < arr.length; i++) {
        arrRes.push(fn(arr[i]));
    }
    return arrRes;
}

function calculateAge(el) {
    return 2016 - el;
}

function isFullAge(limit, el) {
    return el >= limit;
}

var ages = arrayCalc(years, calculateAge);

var fullJapan = arrayCalc(ages, isFullAge.bind(this, 20));

console.log(fullJapan);
    state = {
      contacts: [
        {
          id: 1,
          name: 'John Doe',
          email: 'jdoe@gmail.com',
          phone: '555-555-5555'
        },
        {
          id: 2,
          name: 'Karen Williams',
          email: 'karen@gmail.com',
          phone: '555-555-5555'
        },
        {
          id: 3,
          name: 'Henry Johnson',
          email: 'henry@gmail.com',
          phone: '555-555-5555'
        }
      ]
    };

    
    const newContact = {
      id: 5,
      name: 'Peter',
      email: 'peter@email.com',
      phone: '12355489556'
    }
    
    //Removing elements from object
    /* const { contacts } = state;
    const newState = {
      contacts,
      contacts: state.contacts.filter(contact => contact.id !== 1)
    } */
    
    //Adding new element to an object
    const newState = {
      ...state,
      contacts: [newContact, ...state.contacts]
    }

    console.log(newState);
const gradeCalc = function (score, totalScore) {
    if (typeof score !== 'number' || typeof totalScore !== 'number') {
        throw Error('Please provide numbers only')
    }

    const percent = (score / totalScore) * 100
    let letterGrade = ''

    if (percent >= 90) {
        letterGrade = 'A'
    } else if (percent >= 80) {
        letterGrade = 'B'
    } else if (percent >= 70) {
        letterGrade = 'C'
    } else if (percent >= 60) {
        letterGrade = 'D'
    } else {
        letterGrade = 'F'
    }

    return `You got a ${letterGrade} (${percent}%)!`
}

try {
    const result = gradeCalc(9, true)
    console.log(result)
} catch (e) {
    console.log(e.message)
}

以上是关于javascript JavaScript高级概念的主要内容,如果未能解决你的问题,请参考以下文章

javascript高级编程笔记01(基本概念)

JavaScript高级程序设计学习之基本概念

JavaScript高级程序设计-基础概念

对象的概念——javascript面向对象高级

JavaScript高级部分概念用法

JavaScript高级程序设计基本概念 上