JavaScript Hands On Notes

¶这篇文字随手用来记录 Js 和 Python 的区别

主要内容来自YouTube 视频 Learn JavaScript - Full Course for Beginners

[TOC]

¶Declare Variable{Declare Variable}:

¶Declaring

var can be declared for any types.

Without the var , the variable will be a global variable, which can be created in a function and accessed from outside of function.

¶Declare function:

function function(val)

¶Comparison:

===, ==

=== will looks at type difference, == will not

!== will checks types, != will not

¶Js has switch

function sequentialSizes(val){
	var answer = ""
	switch(val){
	case1: 
	case2:
	case3:
		answer = "low";
		break;
	case 4:
	case 5:
	case 6:
		anwer = 'mid';
		break;
	}
}

¶null

null is called undefined

¶Dictionary(Object)

(the person in video called this “Object”) 这里是JSON Object！

var Dogs = {
	"name": "Camper", // called property: value
	"legs": 4,
	"tails":1,
	"friends":["haha"]
};

var name = Dogs.name // one way of accessing
var name = Dogs[name]

//Delete
delete Dogs.name
delete Dogs[name]

function checkObj(checkProp){  //check if a object has a certain property
	if (myObj.hasOwnProperty(checkProp)){
		return myObj[checkProp];
	} else{
		return "Not Found"
	}
}

Object Exercise:

var collection = {
	"2548":{
		"album": "slippery When Wet",
		"artist": "Bon Jovi",
		"tracks": [
			"Let it Rock",
			"You Give Love a Bad Name"
		]
	}，
	"2523":{
		"album": "slippery When Wet",
		"artist": "Bon Jovi",
		"tracks": [
			"Let it Rock",
			"You Give Love a Bad Name"
		]
	}
}

var collectionCopy = JSON.parse(JSON.stringify(collection))
function updateRecords(id, prop, value){
	if (value === ""){
	delete collection[id][pro];	
	} else if(prop === "tracks"){
		collection[id][prop] = collection[id][prop] || [];
		collection[id][prop].push(value);
	} else {
		collection[id][prop] = value;
	}
	return collection
}

console.log(updateRecords(5439, "artist", "ABBA"));

¶Traverse the Array

和Java一样

¶Math

Js also has Math module

¶convert str to int

parseInt(str)

parseInt(str, 2) parse in base 2

¶Easy condition

condition? statement-if-true: statement-if-false

function checkSign(num){
	retun num > 0 ? "positive" : num <0 ? "negative" : "zero";
}

¶let, var, const

let cannot be declared twice

let is defined in scope. var is not

const is read-only, cannot write

const SENTENCE = "good!";

¶Array

array is immutable

function freezeObj(){
	"use strict";
	const MATH_CONSTANTS = {
		PI: 3.14
	};
	
	Object.freeze(MATH_CONSTANTS); //make object immutalbe 
}

¶Anonymous function

const magic = () => new Date(); // () means function, => means return 

var myConcat = (arr1, arr2) => {arr1.concat(arr2)};

¶Array filter

arr.filter(num => Number.isInteger(num) && num >0).map(x => x *x);

¶Default parameter

const increment = (function(){
	return funtion increment(number, value =1 ){
		return number+value;
	};
})();

¶Rest argument

const num = (function(){
	retuurn function sum(...args){
	   return args.reduce((a,b) => a+b, 0);
	   };
})();
console.log(sum(1,2,3,4));

arr2 = [...arr1]; \\ copy values
arr2 = arr1; \\copy the same reference

const [, , ... arr] = list we can specify which index should be changed.

const greeting = "Hello, my name is ${person.name}" \\inside curly brase is Js

¶Create an object

const createPerson = (name, age, gender) => ({name, age, gender});
console.log(createPerson("Zodiac Hasbro", 56, "male"));

var SpaceShuttle = function(targetPlanet){
	this.targetPlanet = targetPlanet;
}
var zeus = new SpaceShuttle("Jupiter");

console.log(zeus.targetPlanet);

class SpaceShuttle{
	constructor(targetPlanet){
		this.targetPlanet = targetPlanet;
		}
} 
var zeus = new SpaceShuttle("Jupiter");

console.log(zeus.targetPlanet);

¶Getter, Setter

 class Book{
	constructor(author){
        this._author = author;
    }
    get writer(){
        return this._author;
    }
    set writer(updatedAuthor){
            this._author = updatedAuthor;
        }
}

function makeClass(){
    class Thermostat{
        constructor(temp){
            this._temp = 5/9 * (temp-32);
        }  
        get temperature(){
            return this._temp;
        }
        set temperature(updatedTemp){
            this._temp = updatedTemp;
        }
    }
    return Thermostat;
}

const Thermostat = makeClass();
const thermos = new Thermostat(76);

console.log(thermos._temp)

¶export, import

import {capitalizeString} from "./string_function"
const cap = capitalizeString("hello!");

console.log(cap)

//在另一个文件里
export const capitalizeString = str => str.toUpperCase()
//capitalizeString 是一个方法，parameter 是str

export{capitalizeString};
export const foo = 'bar';

import * as capitalizing from "./where"

export default function subtract(x,y){return x-y};
import subtract from "./where"

差不多这就是一些Syntax区别，具体要用再查找吧！ 😄