enter3017sky Blog

Wednesday, Aug 28 2019

使用 window.postMessage 跨域通訊

在既有的架構中,我們能透過 H5 的主頁面開啟其他子頁面,而關閉的方式是透過點擊主頁面的關閉按鈕,做一些操作來關閉子頁面,這次需求是將關閉的按鈕獨立在各個子頁面的 iframe 上。

由於同源政策(Same origin policy),在預設的情況下,兩網域之間的協議(https/http)、網域(dns)、端口(port)匹配才能互相通信。

但我們有幾種方式可以繞過它,達到跨腳本

Sunday, May 19 2019

vue 測試環境顯示 Invalid Host header

目的

建立一個專案,測試 PWA - Add to Home Screen 的效果,解決 iOS 設備加入主畫面之後,透過 加入主畫面的 icon 點擊進去時,沒有顯示圖片。

過程

  1. vue create <repository_name>,建立專案。

  2. yarn serve,把專案跑起來。

  3. locate hosts,查

Sunday, Apr 14 2019

hw3:Event Loop

hw3:Event Loop

在 JavaScript 裡面,一個很重要的概念就是 Event Loop,是 JavaScript 底層在執行程式碼時的運作方式。請你說明以下程式碼會輸出什麼,以及盡可能詳細的解釋原因。


console.log(1)
setTimeout(() => {
  console.log(2)
}, 0)
console.log(
Saturday, Apr 06 2019

MacOS 注音輸入選單不出現了!

sudo kill -HUP  ` ps ax |  grep -v grep | grep TCIM | awk '{print $1}' `

稍微簡單剖析一下上面的指令:

kill -HUP pid 可以通知 process ID 是 pid 的程序重新啟動。

` ...... ` 是執行引號中的指令,而這裡的單引號是和毛毛蟲同一個按鍵哦!

Saturday, Apr 06 2019

研究 KeyboardEvent 之筆記

KeyboardEvent

MDN: KeyboardEvent objects 用來詳述使用者和網頁之間,經由鍵盤產生的互動。每個事件(event)都記錄著一次鍵盤動作。事件類型(keydown 、 keypress 和 keyup)用來表示鍵盤執行哪種動作。

http://keycode.info/、[從 React 原始碼

Sunday, Mar 31 2019

冒泡排序法

Imgur

無時無刻都在想 code,滑 IG 也在看 code,最近看到這個冒泡排序,零散的時間就想一下看一下,後來自己嘗試練習一下。


let myArr = [3, 6, 9, 4, 5, 1, 0, 7, 8, 2]
const bubbleSort = (arr) => {
    l
Tuesday, Mar 26 2019

Parameters, Arguments, Spread operator

什麼是參數(parameters):參數就是我們帶入函式的變數,JavaScript 不一樣的地方就是當你呼叫 myFavorite() 不帶任何參數也可以執行,只是會獲得 undefined(為什麼是 undefined? 這個跟 Hoisting 有關,總之就是在建立執行環境的創造的階段時,JavaScript 設定好記憶體空間給變數和函數,而變數會被賦予 undefined 這個值),而參數

Thursday, Jan 24 2019

JavaScript 基礎


/** 以下為 'React 開發實務' 的內容 */

// ES5
var double = function(n) {
    return n * 2
}
console.log(double(10))

// 只有一個
// 參數可以省略括號,只需要回傳一條陳述句或運算式的結果時,可省略大括號
var triple = n => n * 3
conso
Tuesday, Jan 22 2019

JavaScript 物件導向

JavaScript函數 活用範例速查辭典

書號 312.32 J36 8654

定義類別:

  • 利用 new 運算子呼叫函數,可以確認 Animal 類別的實體確實建立了,而具有建立實體功能的 Animal 函數(與其說是 Animal 類別)更適合被稱為建構式。

var Animal = function() {
    this.n
Tuesday, Jan 22 2019

JavaScript Closure 筆記

Closure 閉包

  • example 1

function buildFunctions() {
    var arr = [];
    for(var i = 0; i < 3; i++) {
        arr.push(
            function() {
                console.log(i)
Friday, Jan 18 2019

code high light TEST

PHP


<?php
// 資料來源名稱 (Data Source Name, DSN)
$dsn = 'mysql:host=localhost; dbname=test_db; charset=utf8';
$db_username = 'root';
$db_password = '';

// 連結資料庫
try {
    $pdo = new PD
Thursday, Jan 10 2019

草稿測試

在文章的 table 多一個 draft 欄位,存入 0 或 1,來判斷是否為草稿

Thursday, Jan 10 2019

PHP - Insert and Display checked values from Database

  • GROUP_CONCAT(): 將資料合併成一行
  • PDO::fetchAll(PDO::FETCH_KEY_PAIR): 把撈出的時候變成 key/value 的配對。
  • in_array: 判斷 checked 的 id 。
    • in_array(mixed 的參數, array(檢查的 arr)[, 嚴格模式(true): 預設 false])
Tuesday, Jan 08 2019

JavaScript 中的 Event Loop

hw3:Event Loop

在 JavaScript 裡面,一個很重要的概念就是 Event Loop,是 JavaScript 底層在執行程式碼時的運作方式。請你說明以下程式碼會輸出什麼,以及盡可能詳細的解釋原因。


console.log(1)
setTimeout(() => {
  console.log(2)
}, 0)
console.log(
Monday, Jan 07 2019

PHP Exceptions 種類與使用情境說明

PHP Exceptions 種類與使用情境說明


主要 Exception

在 PHP 5,Exception 是最終端的主要類別,所有 PHP exception 類別都由此繼承出來。


Throwable

  • PHP7 以後,Throwable 是最上層所有可以被 throw 關鍵字丟出的 interface,它不能直接 new,也不